Toggle color

Examples

Heading

Smaller heading

Inline text

Example link text

Download

Download the SVG to use or edit.

Download SVG

Icon font

Using the web font? Copy, paste, and go.

<i class="modus-icons notranslate">toggle-color</i>

Copy HTML

Paste the SVG right into your project's code.

<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="24" width="24" viewBox="0 0 32 32">
  <path d="M20 21h-8c-2.757 0-5 2.243-5 5s2.243 5 5 5h8c2.757 0 5-2.243 5-5s-2.243-5-5-5zM9 26c0-1.654 1.346-3 3-3s3 1.346 3 3-1.346 3-3 3-3-1.346-3-3zm11 3h-4.026C16.61 28.162 17 27.13 17 26s-.391-2.162-1.026-3H20c1.654 0 3 1.346 3 3s-1.346 3-3 3zm6.857-14.384a1.023 1.023 0 0 0-.058-.213l-1.816-4.606c-.008-.022-.024-.038-.034-.06a.973.973 0 0 0-.242-.444l-8-8a1.03 1.03 0 0 0-1.414 0L13 3.586l-1.293-1.293a1 1 0 1 0-1.414 1.414L11.586 5l-4.53 4.53c-.66.66-1.023 1.537-1.023 2.47s.363 1.81 1.023 2.47l4.474 4.474c.68.681 1.575 1.022 2.47 1.022s1.789-.341 2.47-1.022l4.888-4.888-.095.246a.699.699 0 0 0-.03.087c-.192.441-.29.904-.29 1.378 0 1.814 1.371 3.29 3.057 3.29s3.057-1.476 3.057-3.29c0-.391-.067-.777-.2-1.15zm-11.8 2.914c-.565.565-1.549.565-2.113 0L8.47 13.056a1.495 1.495 0 0 1 0-2.112L13 6.414l3.293 3.293a.997.997 0 0 0 1.414 0 1 1 0 0 0 0-1.414L14.414 5 16 3.414 22.586 10l-7.53 7.53zM24 16.943c-.512 0-.943-.539-.943-1.176 0-.206.05-.41.148-.609.038-.076.065-.155.084-.236l.717-1.84.743 1.886c.015.084.04.168.074.248.08.18.12.366.12.55 0 .638-.431 1.177-.943 1.177z"/>
</svg>