Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">ai_search</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#ai-search" />
</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-ai-search" viewBox="0 0 24 24">
<path d="M8.5 4a6.5 6.5 0 0 1 6.5 6.5c0 1.61-.59 3.09-1.57 4.23l.28.27h.79l4.99 5L18 21.49l-5-4.99v-.79l-.27-.28A6.47 6.47 0 0 1 8.5 17a6.5 6.5 0 1 1 0-13m0 2C6.01 6 4 8.01 4 10.5S6.01 15 8.5 15s4.5-2.01 4.5-4.5S10.99 6 8.5 6"/>
<path fill-rule="evenodd" d="M21.78 6.254a.337.337 0 0 0 0-.633l-.19-.07a2.36 2.36 0 0 1-1.392-1.392l-.07-.189a.337.337 0 0 0-.631 0l-.07.19a2.36 2.36 0 0 1-1.393 1.391l-.189.07a.337.337 0 0 0 0 .633l.19.07a2.36 2.36 0 0 1 1.392 1.392l.07.189a.337.337 0 0 0 .631 0l.07-.19a2.36 2.36 0 0 1 1.393-1.391zm-3.541-2.129a.4.4 0 0 0 0-.75l-.186-.069a1.46 1.46 0 0 1-.86-.86l-.068-.185a.4.4 0 0 0-.75 0l-.069.186a1.46 1.46 0 0 1-.86.86l-.185.068a.4.4 0 0 0 0 .75l.186.069c.398.147.712.461.86.86l.068.185a.4.4 0 0 0 .75 0l.069-.186c.147-.398.461-.712.86-.86zm-.861 3.918a.379.379 0 0 0 0-.71l-.222-.083a.7.7 0 0 1-.406-.406l-.082-.222a.379.379 0 0 0-.71 0l-.083.222a.7.7 0 0 1-.406.406l-.222.082a.379.379 0 0 0 0 .71l.222.083c.188.07.337.218.406.406l.082.222c.122.33.589.33.71 0l.083-.222a.7.7 0 0 1 .406-.406z"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.