Back to índex

Icons

Icon arrow down

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-down"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-down"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-down"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-down"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-down"/></svg></span>

Icon arrow up

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-up"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-up"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-up"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-up"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#arrow-up"/></svg></span>

Icon calendar

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#calendar"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#calendar"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#calendar"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#calendar"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#calendar"/></svg></span>

Icon cart

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#cart"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#cart"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#cart"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#cart"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#cart"/></svg></span>

Icon close

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#close"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#close"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#close"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#close"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#close"/></svg></span>

Icon chevron-left

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-left"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-left"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-left"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-left"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-left"/></svg></span>

Icon chevron-right

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-right"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-right"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-right"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-right"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#chevron-right"/></svg></span>

Icon download

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#download"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#download"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#download"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#download"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#download"/></svg></span>

Icon eye

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#eye"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#eye"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#eye"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#eye"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#eye"/></svg></span>

Icon play

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#play"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#play"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#play"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#play"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#play"/></svg></span>

Icon search

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#search"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#search"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#search"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#search"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#search"/></svg></span>

Icon share

Sample icon--s default size icon--m icon--l icon--xl 
<span class="icon icon--s" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#share"/></svg></span>
<span class="icon" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#share"/></svg></span>
<span class="icon icon--m" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#share"/></svg></span>
<span class="icon icon--l" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#share"/></svg></span>
<span class="icon icon--xl" aria-hidden="true"><svg><use xlink:href="icons/icons.svg#share"/></svg></span>