Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">notifications</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#notifications" />
</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-notifications" viewBox="0 0 24 24">
<path d="M10 21h4c0 1.1-.9 2-2 2s-2-.9-2-2m10.8-2.22c-.31.74-1.04 1.22-1.84 1.22H5.05a2 2 0 0 1-1.44-3.39C4.7 15.48 6 13.41 6 9.99c0-.37.04-.74.11-1.14.02-.1.04-.19.07-.28a5 5 0 0 1 .39-1.1c.14-.28.24-.48.36-.67.08-.12.16-.25.25-.37.13-.17.27-.34.41-.5.1-.11.21-.22.32-.32.16-.15.33-.28.5-.42.15-.11.25-.19.35-.25.2-.13.4-.23.62-.34.17-.09.26-.13.35-.17.29-.12.6-.22.94-.29 0 0 .06-.02.12-.03l.21-.03V2.99c0-.55.45-1 1-1s1 .45 1 1v1.09l.2.03.17.05c.29.06.6.16.89.28.09.04.18.08.27.13.29.15.5.25.7.38l.3.21c.23.17.4.31.56.46.11.1.21.21.31.32.15.16.28.32.41.5a5.5 5.5 0 0 1 .57.96c.09.18.14.28.18.39.09.23.16.47.22.71.05.17.07.26.09.35.08.4.11.77.11 1.14 0 3.42 1.3 5.48 2.39 6.62a2 2 0 0 1 .4 2.17ZM18.95 18C17.6 16.6 16 14.08 16 10c0-.24-.03-.49-.08-.76l-.07-.23c-.04-.16-.08-.32-.15-.47-.02-.06-.05-.11-.08-.17l-.05-.09q-.09-.195-.21-.39c-.05-.08-.11-.16-.17-.24a3 3 0 0 0-.28-.33c-.07-.07-.13-.14-.21-.21-.11-.1-.22-.19-.34-.28s-.17-.13-.23-.17c-.13-.08-.27-.15-.41-.22l-.14-.07s-.06-.04-.1-.05c-.19-.08-.4-.14-.62-.19l-.15-.04c-.2-.04-.47-.06-.73-.06s-.54.03-.8.08c.01 0-.04.02-.09.03-.22.05-.43.11-.61.19-.03.01-.06.03-.1.05l-.14.07c-.14.07-.28.14-.41.22-.06.04-.11.08-.17.12-.18.14-.29.23-.4.32-.08.07-.14.14-.21.21-.1.11-.19.22-.28.33-.06.08-.12.16-.17.24q-.12.195-.21.39c-.07.14-.1.2-.12.26-.06.15-.1.31-.15.47l-.04.15c-.08.36-.1.61-.1.85 0 4.08-1.61 6.61-2.95 8.01h13.9Z"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.