Flywheel icon

thesvg-color:flywheel

The Flywheel icon (thesvg-color:flywheel) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 260 × 260 grid. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: theSVG Color
Author: thesvg.org
License: MIT
Size: 260 × 260

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="260" height="260" viewBox="0 0 260 260"><g fill="none"><g filter="url(#SVG4PMi8FVt)"><path fill="url(#SVGiUpRRdNT)" d="M60.987 225.79c1.059-1.017 2.691-1.129 3.903-.301c33.247 22.725 75.728 26.146 111.756 10.265c2.866-1.263 1.897-5.184-1.235-5.18l-37.331.046a1.84 1.84 0 0 1-1.749-1.27l-4.236-13.06l15.306-.018a3.047 3.047 0 0 0 2.894-3.987l-2.579-7.95a1.836 1.836 0 0 1 1.744-2.402l15.633-.019a1.835 1.835 0 0 1 1.749 1.269l3.552 10.95a3.045 3.045 0 0 0 2.902 2.107l17.273-.021l15.312.054c.294.001.799.055.799.055s.664.163.861.369l7.307 7.619c1.189 1.24 1.115 3.226-.188 4.347c-45.418 39.056-111.415 41.605-159.519 7.646c-1.536-1.084-1.675-3.297-.318-4.6z"/><path fill="url(#SVGiUpRRdNT)" d="M225.02 46.092c1.239-1.248 3.281-1.188 4.416.155c38.146 45.186 40.585 110.248 7.319 157.976c-1.067 1.531-3.256 1.695-4.573.373l-6.015-6.039c-1.047-1.05-1.179-2.703-.349-3.931c24.416-36.114 26.177-82.977 5.285-120.642c-1.246-2.246-4.495-1.876-5.314.558l-4.482 13.327l-11.748 36.053a1.84 1.84 0 0 1-1.74 1.267l-13.775.041l4.776-14.655a3.047 3.047 0 0 0-2.906-3.991l-8.356.025a1.836 1.836 0 0 1-1.75-2.404l4.882-14.984a1.84 1.84 0 0 1 1.74-1.267L204 87.92a3.05 3.05 0 0 0 2.887-2.103l5.397-16.562l4.544-14.343c.075-.239.21-.645.246-.8a.6.6 0 0 1 .114-.147c.082-.071.286-.268.362-.345z"/><path fill="url(#SVGiUpRRdNT)" d="M108.734 204.382a1.836 1.836 0 0 1 1.744-2.402l15.633-.019a1.83 1.83 0 0 1 1.748 1.269l4.236 13.06l-18.155.023a1.84 1.84 0 0 1-1.748-1.27z"/><path fill="url(#SVGiUpRRdNT)" d="M178.53 126.537a1.835 1.835 0 0 1 1.74-1.266l13.774-.041l-5.668 17.395a1.84 1.84 0 0 1-1.74 1.267l-11.238.033a1.835 1.835 0 0 1-1.75-2.404z"/><path fill="url(#SVGiUpRRdNT)" d="M34.996 59.734c1.069 1.064 1.192 2.75.325 3.986c-25.53 36.378-27.642 84.183-6.337 122.452c1.252 2.248 4.508 1.866 5.314-.578l16.162-48.952a1.84 1.84 0 0 1 1.726-1.26l13.859-.132l-4.897 14.832a3.047 3.047 0 0 0 2.922 4.002l8.352-.08a1.836 1.836 0 0 1 1.76 2.411l-5.016 15.191a1.835 1.835 0 0 1-1.725 1.26l-11.633.112a3.05 3.05 0 0 0-2.883 2.148l-5.19 16.827l-4.378 13.862c-.045.159-.115.225-.193.357c-.039-.044.039.044 0 0l-8.022 7.962c-1.24 1.231-3.266 1.166-4.396-.167c-38.773-45.728-40.874-111.932-6.304-159.88c1.078-1.494 3.234-1.643 4.539-.343z"/><path fill="url(#SVGiUpRRdNT)" d="M46.747 34.424c-1.25-1.245-1.182-3.295.174-4.424C92.403-7.876 157.666-9.887 205.249 23.967c1.508 1.073 1.663 3.241.357 4.551l-6.004 6.018c-1.059 1.061-2.733 1.19-3.966.336c-32.243-22.3-73.3-26.34-108.736-12.119c-2.947 1.183-2.03 5.152 1.145 5.15l36.243-.027c.796 0 1.501.511 1.747 1.268l4.25 13.066l-15.331.012a3.047 3.047 0 0 0-2.895 3.989l2.585 7.947a1.835 1.835 0 0 1-1.744 2.404l-15.663.011c-.795 0-1.5-.511-1.746-1.267L91.927 44.35a3.05 3.05 0 0 0-2.906-2.104l-32.557.096c-.214 0-.4.014-.57.004c-.233-.014-.741.036-.966-.023c-.139-.036-.306-.059-.408-.16z"/><path fill="url(#SVGiUpRRdNT)" d="M71.865 117.623a1.835 1.835 0 0 1 1.725-1.26l11.295-.109a1.836 1.836 0 0 1 1.76 2.411l-5.015 15.192a1.835 1.835 0 0 1-1.726 1.26l-13.86.133z"/><path fill="url(#SVGiUpRRdNT)" d="M148.473 42.197c.795 0 1.5.511 1.747 1.268l3.468 10.665a1.835 1.835 0 0 1-1.744 2.403l-15.662.012a1.835 1.835 0 0 1-1.747-1.268l-4.25-13.067z"/></g><defs><linearGradient id="SVGiUpRRdNT" x1="130" x2="130" y1="260" y2="0" gradientUnits="userSpaceOnUse"><stop stop-color="#d1f5e2"/><stop offset="1" stop-color="#cbffe4"/></linearGradient><filter id="SVG4PMi8FVt" width="260" height="262" x="0" y="0" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="2"/><feGaussianBlur stdDeviation="2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.2 0"/><feBlend in2="shape" result="effect1_innerShadow_242_49"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="-3.1"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/><feBlend in2="effect1_innerShadow_242_49" result="effect2_innerShadow_242_49"/></filter></defs></g></svg>

How to use the Flywheel icon

React

import { Icon } from "@iconify/react";

<Icon icon="thesvg-color:flywheel" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="thesvg-color:flywheel" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="thesvg-color:flywheel" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--flywheel]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:flywheel"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="thesvg-color:flywheel"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/thesvg-color/flywheel.svg" alt="Flywheel icon" width="24" height="24">

Flywheel icon FAQ

Is the Flywheel icon free for commercial use?

Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Flywheel icon in React?

Install @iconify/react and render <Icon icon="thesvg-color:flywheel" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Flywheel icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/flywheel.svg" alt="Flywheel icon">, or paste the SVG code inline to style it with CSS.

Browse all theSVG Color icons →