Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">lightbulb_on</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#lightbulb-on" />
</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-lightbulb-on" viewBox="0 0 24 24">
<path d="M4 10H2.5c-.55 0-1 .45-1 1s.45 1 1 1H4c.55 0 1-.45 1-1s-.45-1-1-1m8-5.5c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1v1.5c0 .55.45 1 1 1M7.05 6.05a.996.996 0 0 0 0-1.41L5.99 3.58a.996.996 0 1 0-1.41 1.41l1.06 1.06c.39.39 1.02.39 1.41 0M12 6.5c-3.5 0-6.34 2.85-6.34 6.34 0 1.69.68 3.3 1.86 4.48v.09c0 .67.25 1.28.66 1.74-.04.19-.07.38-.07.59v.62c0 1.45 1.18 2.62 2.62 2.62h2.5c1.45 0 2.62-1.18 2.62-2.62v-.62c0-.19-.02-.38-.06-.56.43-.47.69-1.09.69-1.77v-.09a6.34 6.34 0 0 0 1.86-4.48c0-3.5-2.85-6.34-6.34-6.34m1.86 13.88c0 .34-.28.62-.62.62h-2.5c-.34 0-.62-.28-.62-.62v-.62c0-.34.28-.62.62-.62h2.5c.34 0 .62.28.62.62zm.62-3.97v1.02c0 .34-.28.62-.62.62h-3.72c-.34 0-.62-.28-.62-.62v-1.02a4.36 4.36 0 0 1-1.86-3.56c0-2.4 1.95-4.34 4.34-4.34s4.34 1.95 4.34 4.34c0 1.47-.74 2.78-1.86 3.56M21.5 10H20c-.55 0-1 .45-1 1s.45 1 1 1h1.5c.55 0 1-.45 1-1s-.45-1-1-1m-2.08-6.42a.996.996 0 0 0-1.41 0l-1.06 1.06a.996.996 0 1 0 1.41 1.41l1.06-1.06a.996.996 0 0 0 0-1.41"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.