Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">measure_slope</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#measure-slope" />
</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-measure-slope" viewBox="0 0 24 24">
<path d="M20.873 5.5h.99v16.447H1.874V21h19z"/>
<path d="m18.394 5.359-5.13.517L14.89 7.94l-9.01 6.634-1.625-2.063-1.879 4.643-.344 1.069 1.157-.038 5.028-.646-1.524-1.934 9.01-6.634 1.523 1.934 1.98-4.514.345-1.068z"/>
<path d="m8.528 8.975-.223-.305a1.8 1.8 0 0 1-.336-.792 1.56 1.56 0 0 1 .1-.839q.168-.41.604-.73.449-.327.889-.364.443-.038.828.157.383.195.656.567l.222.304q.268.368.333.794a1.53 1.53 0 0 1-.1.84q-.17.412-.612.736-.442.323-.885.356a1.54 1.54 0 0 1-.827-.161 1.85 1.85 0 0 1-.65-.563m.758-1.021.223.304a.9.9 0 0 0 .311.261q.195.096.418-.067.234-.171.196-.377a.9.9 0 0 0-.158-.377l-.223-.304a1 1 0 0 0-.31-.276q-.185-.105-.427.07-.223.165-.19.38a.9.9 0 0 0 .16.386m-6.194-.076-.222-.305a1.8 1.8 0 0 1-.338-.8 1.56 1.56 0 0 1 .106-.838q.168-.408.6-.723.448-.328.888-.364.444-.038.828.157t.656.567l.223.304q.271.372.335.797a1.5 1.5 0 0 1-.107.83q-.173.408-.616.731-.443.324-.883.36a1.5 1.5 0 0 1-.823-.156 1.8 1.8 0 0 1-.647-.56m.77-1.03.223.305q.123.169.313.264.19.094.405-.062.234-.171.196-.377a.9.9 0 0 0-.159-.377l-.222-.304a1 1 0 0 0-.31-.276q-.185-.106-.428.07-.222.163-.18.382.045.215.162.375m2.913 5.066-.247-8.673.8-.584.248 8.673z"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.