Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">calculate</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#calculate" />
</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-calculate" viewBox="0 0 24 24">
<path d="M4.58 7.08h1.35v1.35a.58.58 0 0 0 1.16 0V7.08h1.35a.58.58 0 0 0 0-1.16H7.09V4.57a.58.58 0 0 0-1.16 0v1.35H4.58a.58.58 0 0 0 0 1.16M5 19.92c.19 0 .38-.07.53-.22l3.02-3.02c.29-.29.29-.77 0-1.06a.754.754 0 0 0-1.06 0l-3.02 3.02c-.29.29-.29.77 0 1.06.15.15.34.22.53.22M2 20c0 1.1.9 2 2 2h7v-9H2zm1.5-5.5h6v6H4c-.28 0-.5-.22-.5-.5zM13 22h7c1.1 0 2-.9 2-2v-7h-9zm1.5-7.5h6V20c0 .28-.22.5-.5.5h-5.5zm5.15-9.98a.646.646 0 0 0-.91 0l-1.07 1.07-1.07-1.07c-.25-.25-.66-.25-.91 0s-.25.66 0 .91l1.07 1.07-1.07 1.07a.646.646 0 1 0 .92.91l1.07-1.07 1.07 1.07c.13.13.29.19.46.19s.33-.06.46-.19c.25-.25.25-.66 0-.91L18.6 6.5l1.07-1.07c.25-.25.25-.66 0-.91ZM20 2h-7v9h9V4c0-1.1-.9-2-2-2m.5 7.5h-6v-6H20c.28 0 .5.22.5.5zM2 4v7h9V2H4c-1.1 0-2 .9-2 2m7.5 5.5h-6V4c0-.28.22-.5.5-.5h5.5zm6.25 7.25h3.6c.41 0 .75-.34.75-.75s-.34-.75-.75-.75h-3.6c-.41 0-.75.34-.75.75s.34.75.75.75m3.6 1.5h-3.6c-.41 0-.75.34-.75.75s.34.75.75.75h3.6c.41 0 .75-.34.75-.75s-.34-.75-.75-.75"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.