Icons preset

Gebruik elk icoon met Pure CSS voor UnoCSS.

Bron Code

TIP

Aanbevolen lezen: Icons in Pure CSS

Volg de volgende conventies om de icons te gebruiken

• <prefix><collection>-<icon>
• <prefix><collection>:<icon>

Bijvoorbeeld:

<!-- Een basis anker icoon van Phosphor icons -->
<div class="i-ph-anchor-simple-thin" />
<!-- Een oranje alarm van Material Design Icons -->
<div class="i-mdi-alarm text-orange-400" />
<!-- Een groot Vue logo -->
<div class="i-logos-vue text-3xl" />
<!-- Zon in lichte modus, Maan in donkere modus, van Carbon -->
<button class="i-carbon-sun dark:i-carbon-moon" />
<!-- Twemoji van lachen, tranen bij hoveren -->
<div class="i-twemoji-grinning-face-with-smiling-eyes hover:i-twemoji-face-with-tears-of-joy" />

Hover it

Bekijk alle beschikbare icons.

Installatie

pnpm

pnpm add -D @unocss/preset-icons @iconify-json/[de-collection-die-je-wilt]