Skip to content
Snippets Groups Projects

Add new icons (tag, tags, stats, file with text)

Merged Add new icons (tag, tags, stats, file with text)
feat/new-icons into master
Merged Alexa Valentová requested to merge feat/new-icons into master
Compare
and
13 files
+ 1163
− 1772
Compare changes
  • Side-by-side
  • Inline
Files
13
source/_patterns/00-atoms/02-icons/icons.mustache
+ 1069
− 1032
<div class="grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-8 xl:grid-cols-16 gap-2 items-center">
<div class="grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-8 xl:grid-cols-16 gap-2 items-center">
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--glass"></i>
<i class="ico--glass"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--glass</code>
<code>.ico--glass</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--checkmark"></i>
<i class="ico--checkmark"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--checkmark</code>
<code>.ico--checkmark</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--info"></i>
<i class="ico--info"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--info</code>
<code>.ico--info</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--question"></i>
<i class="ico--question"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--question</code>
<code>.ico--question</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--warning"></i>
<i class="ico--warning"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--warning</code>
<code>.ico--warning</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--code"></i>
<i class="ico--code"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--code</code>
<code>.ico--code</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--checkbox-unchecked"></i>
<i class="ico--checkbox-unchecked"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--checkbox-unchecked</code>
<code>.ico--checkbox-unchecked</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--star-full"></i>
<i class="ico--star-full"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--star-full</code>
<code>.ico--star-full</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--star-empty"></i>
<i class="ico--star-empty"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--star-empty</code>
<code>.ico--star-empty</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--bookmark"></i>
<i class="ico--bookmark"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--bookmark</code>
<code>.ico--bookmark</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--cog"></i>
<i class="ico--cog"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--cog</code>
<code>.ico--cog</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--key"></i>
<i class="ico--key"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--key</code>
<code>.ico--key</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--zoom-in"></i>
<i class="ico--zoom-in"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--zoom-in</code>
<code>.ico--zoom-in</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--zoom-out"></i>
<i class="ico--zoom-out"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--zoom-out</code>
<code>.ico--zoom-out</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--shrink"></i>
<i class="ico--shrink"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--shrink</code>
<code>.ico--shrink</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--printer"></i>
<i class="ico--printer"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--printer</code>
<code>.ico--printer</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--file-openoffice"></i>
<i class="ico--user"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--file-openoffice</code>
<code>.ico--user</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--user"></i>
<i class="ico--file-openoffice"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--user</code>
<code>.ico--file-openoffice</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--file-excel"></i>
<i class="ico--file-excel"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--file-excel</code>
<code>.ico--file-excel</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--file-word"></i>
<i class="ico--file-word"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--file-word</code>
<code>.ico--file-word</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--file-pdf"></i>
<i class="ico--file-pdf"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--file-pdf</code>
<code>.ico--file-pdf</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--file-picture"></i>
<i class="ico--file-picture"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--file-picture</code>
<code>.ico--file-picture</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--file-blank"></i>
<i class="ico--file-text2"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--file-blank</code>
<code>.ico--file-text2</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--folder-upload"></i>
<i class="ico--file-blank"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--folder-upload</code>
<code>.ico--file-blank</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--upload"></i>
<i class="ico--folder-upload"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--upload</code>
<code>.ico--folder-upload</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--cloud-upload"></i>
<i class="ico--upload"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--cloud-upload</code>
<code>.ico--upload</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--folder-download"></i>
<i class="ico--cloud-upload"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--folder-download</code>
<code>.ico--cloud-upload</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--download"></i>
<i class="ico--folder-download"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--download</code>
<code>.ico--folder-download</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--cloud-download"></i>
<i class="ico--download"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--cloud-download</code>
<code>.ico--download</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--alarm"></i>
<i class="ico--cloud-download"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--alarm</code>
<code>.ico--cloud-download</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--calculator"></i>
<i class="ico--alarm"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--calculator</code>
<code>.ico--alarm</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--facebook-full"></i>
<i class="ico--calculator"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--facebook-full</code>
<code>.ico--calculator</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--feed"></i>
<i class="ico--facebook-full"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--feed</code>
<code>.ico--facebook-full</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--library"></i>
<i class="ico--feed"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--library</code>
<code>.ico--feed</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--office"></i>
<i class="ico--library"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--office</code>
<code>.ico--library</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--attachment"></i>
<i class="ico--office"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--attachment</code>
<code>.ico--office</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--enlarge"></i>
<i class="ico--attachment"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--enlarge</code>
<code>.ico--attachment</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--eye-off"></i>
<i class="ico--enlarge"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--eye-off</code>
<code>.ico--enlarge</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--eye"></i>
<i class="ico--eye-off"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--eye</code>
<code>.ico--eye-off</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--share"></i>
<i class="ico--eye"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--share</code>
<code>.ico--eye</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--search"></i>
<i class="ico--share"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--search</code>
<code>.ico--share</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--pencil"></i>
<i class="ico--search"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--pencil</code>
<code>.ico--search</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--lock-open"></i>
<i class="ico--pencil"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--lock-open</code>
<code>.ico--pencil</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--lock"></i>
<i class="ico--lock-open"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--lock</code>
<code>.ico--lock-open</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--equalizer"></i>
<i class="ico--lock"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--equalizer</code>
<code>.ico--lock</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--switch"></i>
<i class="ico--equalizer"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--switch</code>
<code>.ico--equalizer</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--loop"></i>
<i class="ico--switch"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--loop</code>
<code>.ico--switch</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--refresh"></i>
<i class="ico--loop"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--refresh</code>
<code>.ico--loop</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--bullhorn"></i>
<i class="ico--refresh"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--bullhorn</code>
<code>.ico--refresh</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--bin"></i>
<i class="ico--bullhorn"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--bin</code>
<code>.ico--bullhorn</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--cross"></i>
<i class="ico--bin"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--cross</code>
<code>.ico--bin</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--checkbox-checked"></i>
<i class="ico--cross"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--checkbox-checked</code>
<code>.ico--cross</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--globe"></i>
<i class="ico--checkbox-checked"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--globe</code>
<code>.ico--checkbox-checked</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--wikipedia"></i>
<i class="ico--globe"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--wikipedia</code>
<code>.ico--globe</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--youtube"></i>
<i class="ico--wikipedia"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--youtube</code>
<code>.ico--wikipedia</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--users"></i>
<i class="ico--youtube"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--users</code>
<code>.ico--youtube</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--book"></i>
<i class="ico--users"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--book</code>
<code>.ico--users</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--bubbles"></i>
<i class="ico--book"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--bubbles</code>
<code>.ico--book</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--map"></i>
<i class="ico--bubbles"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--map</code>
<code>.ico--bubbles</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--compass"></i>
<i class="ico--map"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--compass</code>
<code>.ico--map</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--folder-open"></i>
<i class="ico--compass"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--folder-open</code>
<code>.ico--compass</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--folder"></i>
<i class="ico--folder-open"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--folder</code>
<code>.ico--folder-open</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--drawer"></i>
<i class="ico--folder"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--drawer</code>
<code>.ico--folder</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--stop"></i>
<i class="ico--drawer"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--stop</code>
<code>.ico--drawer</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--github"></i>
<i class="ico--stop"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--github</code>
<code>.ico--stop</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--clock"></i>
<i class="ico--github"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--clock</code>
<code>.ico--github</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--calendar"></i>
<i class="ico--clock"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--calendar</code>
<code>.ico--clock</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--flickr"></i>
<i class="ico--calendar"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--flickr</code>
<code>.ico--calendar</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--instagram"></i>
<i class="ico--flickr"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--instagram</code>
<code>.ico--flickr</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--twitter"></i>
<i class="ico--instagram"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--twitter</code>
<code>.ico--instagram</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--newspaper"></i>
<i class="ico--twitter"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--newspaper</code>
<code>.ico--twitter</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--cart"></i>
<i class="ico--newspaper"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--cart</code>
<code>.ico--newspaper</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--home"></i>
<i class="ico--cart"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--home</code>
<code>.ico--cart</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--link"></i>
<i class="ico--home"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--link</code>
<code>.ico--home</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--power"></i>
<i class="ico--link"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--power</code>
<code>.ico--link</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--rocket"></i>
<i class="ico--power"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--rocket</code>
<code>.ico--power</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--location"></i>
<i class="ico--rocket"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--location</code>
<code>.ico--rocket</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--phone"></i>
<i class="ico--location"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--phone</code>
<code>.ico--location</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--linkedin"></i>
<i class="ico--phone"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--linkedin</code>
<code>.ico--phone</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--facebook"></i>
<i class="ico--linkedin"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--facebook</code>
<code>.ico--linkedin</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--food"></i>
<i class="ico--facebook"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--food</code>
<code>.ico--facebook</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--dots-three-vertical"></i>
<i class="ico--food"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--dots-three-vertical</code>
<code>.ico--food</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--dots-three-horizontal"></i>
<i class="ico--dots-three-vertical"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--dots-three-horizontal</code>
<code>.ico--dots-three-vertical</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--log-out"></i>
<i class="ico--dots-three-horizontal"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--log-out</code>
<code>.ico--dots-three-horizontal</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--envelope"></i>
<i class="ico--log-out"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--envelope</code>
<code>.ico--log-out</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--pin"></i>
<i class="ico--envelope"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--pin</code>
<code>.ico--envelope</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--at"></i>
<i class="ico--pin"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--at</code>
<code>.ico--pin</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--bed"></i>
<i class="ico--at"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--bed</code>
<code>.ico--at</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--train"></i>
<i class="ico--bed"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--train</code>
<code>.ico--bed</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--bus"></i>
<i class="ico--train"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--bus</code>
<code>.ico--train</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--wheelchair"></i>
<i class="ico--bus"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--wheelchair</code>
<code>.ico--bus</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--thumbs-down"></i>
<i class="ico--wheelchair"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--thumbs-down</code>
<code>.ico--wheelchair</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--thumbs-up"></i>
<i class="ico--thumbs-down"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--thumbs-up</code>
<code>.ico--thumbs-down</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--anchor"></i>
<i class="ico--thumbs-up"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--anchor</code>
<code>.ico--thumbs-up</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--paw"></i>
<i class="ico--anchor"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--paw</code>
<code>.ico--anchor</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--strategy"></i>
<i class="ico--paw"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--strategy</code>
<code>.ico--paw</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--pig"></i>
<i class="ico--strategy"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--pig</code>
<code>.ico--strategy</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--donation-outline"></i>
<i class="ico--pig"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--donation-outline</code>
<code>.ico--pig</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--donation-full"></i>
<i class="ico--donation-outline"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--donation-full</code>
<code>.ico--donation-outline</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--thermometer"></i>
<i class="ico--donation-full"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--thermometer</code>
<code>.ico--donation-full</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--menu"></i>
<i class="ico--thermometer"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--menu</code>
<code>.ico--thermometer</code>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--chevron-right"></i>
<i class="ico--menu"></i>
</div>
</div>
<div class="card__body p-2 text-2xs">
<div class="card__body p-2 text-2xs">
<code>.ico--chevron-right</code>
<code>.ico--menu</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--chevron-right"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--chevron-right</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--chevron-left"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--chevron-left</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--chevron-down"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--chevron-down</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--chevron-up"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--chevron-up</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--link-horizontal"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--link-horizontal</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--beer"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--beer</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--pirati"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--pirati</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--jitsi"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--jitsi</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--forum"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--forum</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--helios"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--helios</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--redmine"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--redmine</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--zulip"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--zulip</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--mastodon"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--mastodon</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--open-source"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--open-source</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--price-tag"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--price-tag</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--price-tags"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--price-tags</code>
 
</div>
 
</div>
 
 
<div class="card">
 
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
 
<i class="ico--stats-dots"></i>
 
</div>
 
<div class="card__body p-2 text-2xs">
 
<code>.ico--stats-dots</code>
 
</div>
</div>
</div>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--chevron-left"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--chevron-left</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--chevron-down"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--chevron-down</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--chevron-up"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--chevron-up</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--link-horizontal"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--link-horizontal</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--beer"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--beer</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--pirati"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--pirati</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--jitsi"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--jitsi</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--forum"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--forum</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--helios"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--helios</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--redmine"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--redmine</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--zulip"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--zulip</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--mastodon"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--mastodon</code>
</div>
</div>
<div class="card">
<div class="flex justify-center items-center h-16 text-2xl border-b border-grey-100 bg-grey-50 p-2">
<i class="ico--open-source"></i>
</div>
<div class="card__body p-2 text-2xs">
<code>.ico--open-source</code>
</div>
</div></div>

Pirátský GitLab - Home of the CopyLeft