Home/Libraries/Pepicons (Iconify)/gear-filled

Pepicons (Iconify)

GearFilled

License: CC-BY-4.0

ICON SIZE

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 20 20"><g fill="#818cf8"><path d="M10.558 2.25a.75.75 0 0 1 .685.447l.443 1A.75.75 0 0 1 11 4.75H9a.75.75 0 0 1-.703-1.012l.373-1a.75.75 0 0 1 .703-.488h1.185Zm-1.115 15.5a.75.75 0 0 1-.686-.447l-.443-1A.75.75 0 0 1 9 15.25h2a.75.75 0 0 1 .703 1.012l-.373 1a.75.75 0 0 1-.703.488H9.443Zm8.307-7.193a.75.75 0 0 1-.446.686l-1 .443A.75.75 0 0 1 15.25 11V9a.75.75 0 0 1 1.012-.703l1 .373a.75.75 0 0 1 .488.703v1.184ZM2.25 9.442a.75.75 0 0 1 .447-.685l1-.443A.75.75 0 0 1 4.75 9v2a.75.75 0 0 1-1.012.703l-1-.373a.75.75 0 0 1-.488-.703V9.442Zm13.624-4.528a.75.75 0 0 1 .17.8l-.395 1.02a.75.75 0 0 1-1.23.26l-1.414-1.413a.75.75 0 0 1 .219-1.213l.97-.443a.75.75 0 0 1 .843.151l.837.838ZM4.126 15.086a.75.75 0 0 1-.17-.8l.395-1.02a.75.75 0 0 1 1.23-.26l1.414 1.413a.75.75 0 0 1-.219 1.213l-.97.443a.75.75 0 0 1-.842-.151l-.838-.838Zm10.96.788a.75.75 0 0 1-.8.17l-1.02-.395a.75.75 0 0 1-.26-1.23l1.414-1.414a.75.75 0 0 1 1.212.219l.444.97a.75.75 0 0 1-.152.842l-.838.838ZM4.914 4.126a.75.75 0 0 1 .801-.17l1.02.395a.75.75 0 0 1 .26 1.23L5.58 6.995a.75.75 0 0 1-1.213-.219l-.443-.97a.75.75 0 0 1 .152-.843l.837-.837Z"/><path fill-rule="evenodd" d="M5.58 14.42A6.236 6.236 0 0 0 10 16.25a6.236 6.236 0 0 0 4.42-1.83A6.236 6.236 0 0 0 16.25 10a6.236 6.236 0 0 0-1.83-4.42A6.236 6.236 0 0 0 10 3.75a6.236 6.236 0 0 0-4.42 1.83A6.236 6.236 0 0 0 3.75 10c0 1.678.668 3.256 1.83 4.42Zm5.657-3.183A1.737 1.737 0 0 1 10 11.75c-.472 0-.91-.185-1.237-.513A1.737 1.737 0 0 1 8.25 10c0-.472.185-.91.513-1.237A1.737 1.737 0 0 1 10 8.25c.472 0 .91.185 1.237.513c.328.327.513.765.513 1.237c0 .472-.185.91-.513 1.237Z" clip-rule="evenodd"/></g></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. GearFilledIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.