Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">ghost</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#ghost" />
</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-ghost" viewBox="0 0 24 24">
<path d="M12.602 1.017c4.735.285 8.445 4.062 8.445 8.6v4.092c0 1.452.113 2.917.336 4.354l.608 3.933a.83.83 0 0 1-.224.701 1 1 0 0 1-.72.304c-.912 0-1.412-.39-1.743-.649-.246-.192-.307-.231-.517-.231-.209 0-.268.04-.514.23-.33.26-.83.65-1.743.65-.912 0-1.411-.39-1.742-.649-.246-.191-.306-.231-.517-.231-.21 0-.271.04-.517.231-.331.258-.831.649-1.744.649s-1.412-.39-1.742-.648c-.248-.193-.309-.232-.52-.232-.21 0-.27.04-.518.231-.33.258-.832.649-1.745.649s-1.413-.39-1.745-.648c-.248-.191-.308-.232-.52-.232s-.273.04-.52.232c-.333.257-.833.648-1.748.648a1 1 0 0 1-.72-.304.84.84 0 0 1-.223-.701l.608-3.932c.223-1.437.335-2.902.335-4.354V9.36c0-2.302 1.043-4.525 2.862-6.1C7.658 1.662 10.08.868 12.602 1.017m-.123 1.758c-2.019-.12-3.908.509-5.363 1.769C5.66 5.806 4.857 7.516 4.857 9.36v4.35c0 1.535-.12 3.084-.354 4.603l-.35 2.262a2.6 2.6 0 0 1 1.067-.215c.913 0 1.413.39 1.745.646.248.194.308.234.52.234.211 0 .271-.04.519-.234.33-.256.831-.646 1.744-.646s1.415.39 1.746.647c.246.192.305.233.516.233.21 0 .27-.04.517-.233.331-.257.832-.647 1.744-.647.914 0 1.414.39 1.745.647.245.192.305.233.514.233s.268-.04.513-.232c.332-.258.832-.648 1.744-.648.439 0 .785.091 1.06.214l-.35-2.262a30 30 0 0 1-.354-4.603V9.617c0-3.613-2.928-6.618-6.664-6.842m-3.548 4.68a1.53 1.53 0 1 1 0 3.06 1.53 1.53 0 0 1 0-3.06m6.138 0a1.529 1.529 0 1 1 0 3.06 1.53 1.53 0 0 1 0-3.06"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.