Original icon colors are kept until you pick a new color.
Settings - Vector and 3D Icons
Source, author, and license are available in the preview and icon details. Settings - Free for commercial use. License shown on every icon.. No Sign-Up Required | 100% Browser-Based Processing
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="36" height="36" fill="currentColor" role="img" aria-label="Settings icon"><title>Settings - MingCute Icons icon</title><desc>Free Settings vector icon from the MingCute Icons open-source icon library; scalable W3C SVG 2.0 graphic for web and design use.</desc><path fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="2" d="M17.947 5.545a.51.51 0 0 0-.171-.447 9 9 0 0 0-2.684-1.551.51.51 0 0 0-.473.075c-.761.548-1.658.88-2.619.88-.96 0-1.858-.332-2.62-.88a.51.51 0 0 0-.473-.075 9 9 0 0 0-2.683 1.552.51.51 0 0 0-.171.446c.093.933-.068 1.875-.548 2.706-.48.832-1.215 1.443-2.07 1.828a.51.51 0 0 0-.302.373 9 9 0 0 0 0 3.098.51.51 0 0 0 .301.373c.856.386 1.59.997 2.07 1.828s.642 1.773.549 2.706a.51.51 0 0 0 .171.447 9 9 0 0 0 2.683 1.552c.16.058.336.024.474-.075.761-.549 1.659-.88 2.619-.88s1.858.331 2.62.88a.51.51 0 0 0 .473.075 9 9 0 0 0 2.683-1.552.51.51 0 0 0 .171-.447c-.093-.933.068-1.875.548-2.706s1.215-1.442 2.07-1.828a.51.51 0 0 0 .302-.373 9 9 0 0 0 0-3.098.51.51 0 0 0-.301-.373c-.856-.385-1.59-.996-2.07-1.828-.48-.83-.642-1.773-.549-2.706Z"/><path fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/></svg>
Want to Improve or Restyle This Icon? Settings
Generate a precise engineering prompt, or improve the icon on the canvas right now. Settings
Library: MingCute Icons | Author: MingCute Design | License: Apache-2.0 | No Sign-Up Required | 100% Browser-Based Processing
Settings - Technical Vector Specifications
Source, author, and license are available in the preview and icon details. Settings
| Canonical asset identifier | mingcute/settings-3 |
|---|---|
| Source library pack | MingCute Icons |
| Coordinate grid and viewBox | viewBox="0 0 24 24" |
| Uncompressed payload | 1,276 bytes (~702 bytes gzipped) |
| SPDX license and commercial use | Apache-2.0 - Free for commercial use |
| Supported export targets | SVG, PNG (32px-2048px), WebP, ICO, React TSX, Vue 3, Svelte, Tailwind CSS, CSS Mask, Base64 |
| Security and privacy guarantee | No Sign-Up Required | 100% Browser-Based Processing |
How to Use and Customize This Icon: Settings
- Customize visually: Color, Auto (Stroke and Fill), Stroke Width (
0.5px-4px), Live Vector Animation Presets - Download vector or raster: Download SVG, PNG (Transparent), WebP (Optimized) (
2048x2048 px) - Copy framework code: Copy ready code for React, Next.js, Vue 3, Svelte, Angular, HTML, and CSS masks.
- Deep vector editing: Edit in SVG Editor (76,166)
settings-3.svg aria-hidden="true" focusable="false"
Cross-Library Matches ("settings-3")
Compare this icon across other open-source vector libraries.
Settings 3
MingCute Icons Fill|toolsMore in Tools & Settings
BrowseSettings 1
MingCute Icons|toolsSettings 1
MingCute Icons Fill|toolsSettings 2
MingCute Icons|toolsSettings 2
MingCute Icons Fill|toolsSettings 3
MingCute Icons Fill|toolsSettings 4
MingCute Icons|toolsSettings 4
MingCute Icons Fill|toolsSettings 5
MingCute Icons|toolsSettings 5
MingCute Icons Fill|toolsSettings 6
MingCute Icons|toolsSettings 6
MingCute Icons Fill|toolsSettings 7
MingCute Icons|toolsExplore more
Settings - Frequently Asked Questions
Is the Settings SVG icon free for commercial use? +
Yes. The Settings icon from the MingCute Icons collection is licensed under Apache-2.0. You can use it free of charge in commercial websites, mobile apps, SaaS products, and print designs.
Does the Settings icon keep its original default colors on download? +
Yes. By default, downloading Settings keeps its original SVG colors and stroke settings untouched. If you pick a custom color or stroke width in the live editor, your downloaded file will include your custom changes.
How do I use the Settings icon in React, Next.js, or Vue? +
Switch to the React TSX or Vue 3 tab on this page and click Copy SVG. Paste the component into your project and style it with standard CSS or Tailwind classes.
Can I download Settings as a transparent PNG image? +
Yes. Choose your preferred size such as 64px, 128px, 256px, 512px, or 2048px and click Download PNG to render a high-resolution transparent PNG in your browser.
How do I animate the Settings SVG icon with CSS? +
Click any animation button in the Live Editor such as Spin, Pulse, Bounce, Float, or Draw. The SVG code and download automatically include the matching CSS keyframes.
Can I generate an AI prompt for Settings? +
Yes. Use the AI Icon Prompt Generator section on this page to create a tailored prompt for Settings in 3D Clay, Glassmorphism, Neon, or Minimalist Vector style.
Can I resize the Settings icon without losing quality? +
Yes. The Settings file is a vector with a scalable viewBox, so it stays sharp at 16px, 64px, 512px, or any print size.
Where do I report a problem with the Settings icon file? +
Write to support@svgnexus.com with the icon URL. License and takedown questions about Settings go to legal@svgnexus.com.
SVG Editor
Edit paths, layers, colors, and animations in your browser, then export clean SVG, PNG, or framework code.