Skip to main content

Sun


Examples

Heading
Smaller heading

Inline text 

Example link text 

Icon font

Use in web applications, on buttons, and anywhere you need more than a few icons.

<i class="modus-icons" aria-hidden="true">sun</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-solid-icons.svg#sun" />
</svg>

SVG code

Use when you don't want any dependency.

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="mi-solid mi-sun" viewBox="0 0 24 24">
  <path d="M5 12c0-.34.03-.67.08-1H3c-.55 0-1 .45-1 1s.45 1 1 1h2.08c-.05-.33-.08-.66-.08-1m1.4-4.19c.4-.54.88-1.01 1.41-1.41L6.34 4.93a.996.996 0 1 0-1.41 1.41zm11.2 0 1.47-1.47a.996.996 0 1 0-1.41-1.41L16.19 6.4c.54.4 1.01.88 1.41 1.41M6.4 16.18l-1.47 1.47a.996.996 0 0 0 .71 1.7c.26 0 .51-.1.71-.29l1.47-1.47c-.54-.4-1.01-.88-1.41-1.41ZM13 5.07V2.99c0-.55-.45-1-1-1s-1 .45-1 1v2.08c.33-.05.66-.08 1-.08s.67.03 1 .08m8 5.92h-2.08c.05.33.08.66.08 1s-.03.67-.08 1H21c.55 0 1-.45 1-1s-.45-1-1-1m-3.4 5.19c-.4.54-.88 1.01-1.41 1.41l1.47 1.47c.2.2.45.29.71.29s.51-.1.71-.29a.996.996 0 0 0 0-1.41l-1.47-1.47ZM12 6.99c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5m-1 11.92v2.08c0 .55.45 1 1 1s1-.45 1-1v-2.08c-.33.05-.66.08-1 .08s-.67-.03-1-.08"/>
</svg>

SVG CSS code

Use for embedding your icons in CSS with no dependency.