Alain Afflelou Design System

Afflelou: Largeur Du Pont 

<svg class=" shrink-0" width="48" height="24" viewBox="0 0 64 40.34" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path fill-rule="evenodd" clip-rule="evenodd" d="M15.1071 27.3C22.2316 27.3 28.0071 21.5245 28.0071 14.4C28.0071 7.27553 22.2316 1.5 15.1071 1.5C7.98262 1.5 2.20709 7.27553 2.20709 14.4C2.20709 21.5245 7.98262 27.3 15.1071 27.3ZM15.1071 28.8C23.06 28.8 29.5071 22.3529 29.5071 14.4C29.5071 6.4471 23.06 0 15.1071 0C7.15419 0 0.707092 6.4471 0.707092 14.4C0.707092 22.3529 7.15419 28.8 15.1071 28.8Z" fill="currentColor" />
    <path fill-rule="evenodd" clip-rule="evenodd" d="M50.3063 27.3C57.4308 27.3 63.2063 21.5245 63.2063 14.4C63.2063 7.27553 57.4308 1.5 50.3063 1.5C43.1818 1.5 37.4063 7.27553 37.4063 14.4C37.4063 21.5245 43.1818 27.3 50.3063 27.3ZM50.3063 28.8C58.2592 28.8 64.7063 22.3529 64.7063 14.4C64.7063 6.4471 58.2592 0 50.3063 0C42.3534 0 35.9063 6.4471 35.9063 14.4C35.9063 22.3529 42.3534 28.8 50.3063 28.8Z" fill="currentColor" />
    <path fill-rule="evenodd" clip-rule="evenodd" d="M35.9079 15.15H29.5079V13.65H35.9079V15.15Z" fill="currentColor" />
    <path fill-rule="evenodd" clip-rule="evenodd" d="M27.5158 37.7L29.8622 40.0464L29.1551 40.7536L25.6015 37.2L29.1551 33.6464L29.8622 34.3536L27.5158 36.7H37.9015L35.5551 34.3536L36.2622 33.6464L39.8158 37.2L36.2622 40.7536L35.5551 40.0464L37.9015 37.7H27.5158Z" fill="#A3A3A3" />
</svg>
 
{% include "@template-icon" with {
    width: size|default(24)*2,
    height: size|default(24),
} %}
 
{
  "viewBox": "0 0 64 40.34",
  "type": "afflelou",
  "paths": [
    {
      "path": "M15.1071 27.3C22.2316 27.3 28.0071 21.5245 28.0071 14.4C28.0071 7.27553 22.2316 1.5 15.1071 1.5C7.98262 1.5 2.20709 7.27553 2.20709 14.4C2.20709 21.5245 7.98262 27.3 15.1071 27.3ZM15.1071 28.8C23.06 28.8 29.5071 22.3529 29.5071 14.4C29.5071 6.4471 23.06 0 15.1071 0C7.15419 0 0.707092 6.4471 0.707092 14.4C0.707092 22.3529 7.15419 28.8 15.1071 28.8Z"
    },
    {
      "path": "M50.3063 27.3C57.4308 27.3 63.2063 21.5245 63.2063 14.4C63.2063 7.27553 57.4308 1.5 50.3063 1.5C43.1818 1.5 37.4063 7.27553 37.4063 14.4C37.4063 21.5245 43.1818 27.3 50.3063 27.3ZM50.3063 28.8C58.2592 28.8 64.7063 22.3529 64.7063 14.4C64.7063 6.4471 58.2592 0 50.3063 0C42.3534 0 35.9063 6.4471 35.9063 14.4C35.9063 22.3529 42.3534 28.8 50.3063 28.8Z"
    },
    {
      "path": "M35.9079 15.15H29.5079V13.65H35.9079V15.15Z"
    },
    {
      "path": "M27.5158 37.7L29.8622 40.0464L29.1551 40.7536L25.6015 37.2L29.1551 33.6464L29.8622 34.3536L27.5158 36.7H37.9015L35.5551 34.3536L36.2622 33.6464L39.8158 37.2L36.2622 40.7536L35.5551 40.0464L37.9015 37.7H27.5158Z",
      "color": "#A3A3A3"
    }
  ]
}

Afflelou icons guide

How to use

(You can click on the icons to copy the correct icon name)

Template name

icons-afflelou

Import

{% render "@icons-afflelou--variant" with {...} %}

Examples

{% render "@icons-afflelou--carre" %}

Available props

  • viewBox: string | default: 0 0 48 24
  • iconClass: string | default: null
  • size: 12, 16, 24, 32, 40, 48, 64, 92 | default: 24
  • path: string | default: svg path d attribute