Alain Afflelou Design System

Social: Google 

<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="M12.4842 20C7.79221 20 4 16.4242 4 12C4 7.5758 7.79221 4 12.4842 4C14.7761 4 16.6899 4.78766 18.1673 6.09062L15.867 8.1832C15.2353 7.61107 14.134 6.94881 12.4842 6.94881C9.58753 6.94881 7.22494 9.21185 7.22494 12.002C7.22494 14.7921 9.58961 17.0551 12.4842 17.0551C15.8421 17.0551 17.1055 14.7783 17.2966 13.6027H12.4842V10.8597H20.4945C20.5694 11.2594 20.6275 11.6591 20.6275 12.1861C20.6296 16.7553 17.3797 20 12.4842 20Z" fill="currentColor" />
</svg>
 
{% include "@template-icon" %}
 
{
  "type": "social",
  "path": "M12.4842 20C7.79221 20 4 16.4242 4 12C4 7.5758 7.79221 4 12.4842 4C14.7761 4 16.6899 4.78766 18.1673 6.09062L15.867 8.1832C15.2353 7.61107 14.134 6.94881 12.4842 6.94881C9.58753 6.94881 7.22494 9.21185 7.22494 12.002C7.22494 14.7921 9.58961 17.0551 12.4842 17.0551C15.8421 17.0551 17.1055 14.7783 17.2966 13.6027H12.4842V10.8597H20.4945C20.5694 11.2594 20.6275 11.6591 20.6275 12.1861C20.6296 16.7553 17.3797 20 12.4842 20Z"
}

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