Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">color_item</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="/connect-icons.svg#color-item" />
</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-connect mi-color-item" viewBox="0 0 24 24">
<path d="M12 3c4.97 0 9 3.58 9 8 0 2.76-2.24 5-5 5h-1.77c-.83 0-1.5.67-1.5 1.5 0 .38.15.73.38.99.24.27.39.62.39 1.01 0 .83-.67 1.5-1.5 1.5a9 9 0 0 1 0-18M6.5 9C5.67 9 5 9.67 5 10.5S5.67 12 6.5 12 8 11.33 8 10.5 7.33 9 6.5 9m11 0c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5S18.33 9 17.5 9m-8-4C8.67 5 8 5.67 8 6.5S8.67 8 9.5 8 11 7.33 11 6.5 10.33 5 9.5 5m5 0c-.83 0-1.5.67-1.5 1.5S13.67 8 14.5 8 16 7.33 16 6.5 15.33 5 14.5 5"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.