Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">component</i>
SVG sprite
Use for static sites when you only need a few icons.
<svg class="mi" width="1em" height="1em" fill="currentColor">
<use xlink:href="/modus-outlined-icons.svg#component" />
</svg>
SVG code
Use when you don't want any dependency.
info_outlined
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="mi-outline mi-component" viewBox="0 0 24 24">
<path d="M12 22.02c-.7 0-1.39-.26-1.92-.79l-7.3-7.3a2.73 2.73 0 0 1 0-3.85L4.1 8.76c-.24-.22-.45-.48-.62-.77-.58-.98-.62-2.16-.1-3.15.5-.96 1.4-1.6 2.44-1.76 1.03-.16 2.09.19 2.83.93l.1.1 1.32-1.32a2.73 2.73 0 0 1 3.85 0l3.49 3.49-1.69.44c-.25.06-.59.23-.81.64s-.18.95.08 1.32l.1.13c.22.25.53.41.86.43.38.03.75-.1 1.02-.37.15-.15.26-.35.33-.59l.45-1.66 3.47 3.47a2.73 2.73 0 0 1 0 3.85l-7.3 7.3c-.53.53-1.23.79-1.92.79ZM6.33 5.03c-.07 0-.13 0-.2.02-.24.04-.69.18-.97.72-.2.38-.18.82.05 1.21.18.31.44.5.8.6l1.66.45L4.2 11.5c-.28.28-.28.74 0 1.02l7.3 7.3c.28.28.74.28 1.02 0l7.3-7.3c.28-.28.28-.74 0-1.02l-1.32-1.32s-.06.07-.1.1a3.305 3.305 0 0 1-5.02-.42l-.19-.3c-.54-.95-.56-2.14-.05-3.13.18-.35.42-.65.69-.9l-1.32-1.32a.724.724 0 0 0-1.02 0L8.02 7.68l-.45-1.66a1.27 1.27 0 0 0-1.24-.97Z"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.