Icon font
Use in web applications, on buttons, and anywhere you need more than a few icons.
<i class="modus-icons" aria-hidden="true">orthogonal</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="/field-systems-icons.svg#orthogonal" />
</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-solid mi-orthogonal" viewBox="0 0 24 24">
<path fill-rule="evenodd" d="M19.04 4.32a.64.64 0 0 1 .64.64v14.08a.64.64 0 0 1-.64.64H4.96a.64.64 0 0 1-.64-.64V4.96a.64.64 0 0 1 .64-.64zm-4.8.64H9.76v4.16h4.48zm.64 14.08h4.16v-4.16h-4.16zm-.64-4.16v4.16H9.76v-4.16zm.64-.64h4.16V9.76h-4.16zm-.64-4.48v4.48H9.76V9.76zm.64-.64h4.16V4.96h-4.16zm-5.76 9.92v-4.16H4.96v4.16zm0-4.8V9.76H4.96v4.48zM4.96 9.12h4.16V4.96H4.96z"/>
<path fill-rule="evenodd" d="M9.76 4.96h4.48v4.16H9.76zm.32 3.84h3.84V5.28h-3.84zM19.04 4c.53 0 .96.43.96.96v14.08c0 .53-.43.96-.96.96H4.96a.96.96 0 0 1-.96-.96V4.96c0-.53.43-.96.96-.96zm0 15.04h-4.16v-4.16h4.16zm-.32-3.84H15.2v3.52h3.52zm-4.8 3.52V15.2h-3.84v3.52zm5.12-4.48h-4.16V9.76h4.16zm-.32-4.16H15.2v3.84h3.52zm-4.8 3.84v-3.84h-3.84v3.84zm5.12-4.8h-4.16V4.96h4.16zm-.32-3.84H15.2V8.8h3.52zm-9.6 9.6v4.16H4.96v-4.16zm-3.84.32v3.52H8.8V15.2zm3.84-5.44v4.48H4.96V9.76zm-3.84.32v3.84H8.8v-3.84zm3.84-.96H4.96V4.96h4.16zM8.8 5.28H5.28V8.8H8.8zm10.88-.32a.64.64 0 0 0-.64-.64H4.96a.64.64 0 0 0-.64.64v14.08c0 .354.287.64.64.64h14.08a.64.64 0 0 0 .64-.64zm-5.44 9.92H9.76v4.16h4.48zm0-5.12H9.76v4.48h4.48z"/>
</svg>
SVG CSS code
Use for embedding your icons in CSS with no dependency.