Alain Afflelou Design System

Social: Twitter 

<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path fill-rule="evenodd" clip-rule="evenodd" d="M13.5222 10.9238L19.4785 4H18.0671L12.8952 10.0118L8.76437 4H4L10.2466 13.0909L4 20.3516H5.41155L10.8732 14.0029L15.2356 20.3516H20L13.5222 10.9238ZM11.5889 13.171L10.956 12.2658L5.92015 5.06259H8.0882L12.1522 10.8758L12.7851 11.7811L18.0677 19.3373H15.8997L11.5889 13.171Z" fill="currentColor" />
</svg>
 
{% include "@template-icon" %}
 
{
  "type": "social",
  "path": "M13.5222 10.9238L19.4785 4H18.0671L12.8952 10.0118L8.76437 4H4L10.2466 13.0909L4 20.3516H5.41155L10.8732 14.0029L15.2356 20.3516H20L13.5222 10.9238ZM11.5889 13.171L10.956 12.2658L5.92015 5.06259H8.0882L12.1522 10.8758L12.7851 11.7811L18.0677 19.3373H15.8997L11.5889 13.171Z"
}

Social icons guide

How to use

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

Template name

icons-social

Import

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

Examples

{% render "@icons-library--facebook" %}

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