Skip to content

Settings 4

The settings-4 icon represents a set of configuration or preference options, often used in applications related to user settings, preferences, or customization.

Add shadcn.io to your AI agent. · Pro It installs Settings 4, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 24 × 24 px

Settings  4 icon from Kameleon color icons

Code

Settings 4 in your framework

In any framework. Customize it above, and the code follows.

export const Settings4Icon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 48 48" {...props}>
    <g fill="none"><path fill="#e04f5f" d="M24 47.998c13.255 0 24-10.745 24-24C48 10.746 37.255 0 24 0S0 10.745 0 23.999s10.745 23.999 24 23.999"/><path fill="#f0f1f1" d="M37.963 35.344a2.62 2.62 0 0 1-2.618 2.618h-22.69a2.62 2.62 0 0 1-2.619-2.619v-22.69a2.62 2.62 0 0 1 2.618-2.617h22.691a2.62 2.62 0 0 1 2.618 2.618z"/><path fill="#fff" d="M35.345 10.036h-22.69a2.62 2.62 0 0 0-2.619 2.618v22.69a2.62 2.62 0 0 0 1.162 2.175L37.52 11.197a2.62 2.62 0 0 0-2.176-1.161"/><path fill="#b6bcbd" d="M24 13.528a.873.873 0 1 0 0-1.746a.873.873 0 0 0 0 1.745m0 22.69a.873.873 0 1 0 0-1.746a.873.873 0 0 0 0 1.746"/><path fill="#5b5c5f" d="M34.473 31.853a.873.873 0 0 1-.873.873h-6.982a.873.873 0 0 1-.872-.873V16.145a.873.873 0 0 1 .872-.873H33.6a.873.873 0 0 1 .873.873zm-12.218 0a.873.873 0 0 1-.873.873H14.4a.87.87 0 0 1-.873-.873V16.145a.87.87 0 0 1 .873-.873h6.982a.873.873 0 0 1 .873.873z"/><path fill="#17b198" d="M34.473 23.563h-8.727v-7.418a.873.873 0 0 1 .872-.873H33.6a.873.873 0 0 1 .873.873z"/><path fill="#fa5655" d="M22.255 31.853a.873.873 0 0 1-.873.873H14.4a.873.873 0 0 1-.873-.873v-7.418h8.728z"/></g>
  </svg>
);

Kameleon color icons

Icons that share its tags, in the same style.

  • Settings 4 Duo icon from Kameleon color icons
  • Power icon from Kameleon color icons
  • Power Duo icon from Kameleon color icons
  • Apartment  2 icon from Kameleon color icons
  • Apartment 2 Duo icon from Kameleon color icons
  • Article File  2 icon from Kameleon color icons
  • Article File 2 Duo icon from Kameleon color icons
  • Astronaut icon from Kameleon color icons
  • Astronaut Duo icon from Kameleon color icons
  • Baby Cart icon from Kameleon color icons
  • Baby Cart Duo icon from Kameleon color icons
  • Bank icon from Kameleon color icons
  • Bank Check icon from Kameleon color icons
  • Hat  2 icon from Kameleon color icons
  • Hat 2 Duo icon from Kameleon color icons
  • Headset  2 icon from Kameleon color icons
  • Headset 2 Duo icon from Kameleon color icons
  • Heart Key icon from Kameleon color icons
  • Heart Key Duo icon from Kameleon color icons
  • Heart Watch icon from Kameleon color icons
  • Heart Watch Duo icon from Kameleon color icons
  • Hook icon from Kameleon color icons
  • Hook Duo icon from Kameleon color icons
  • Popcorn icon from Kameleon color icons

Skip the copy and paste. With Pro, your AI agent finds and installs any Kameleon color icons icon from a prompt.

Get Pro

Tags

Browse by tag

Settings 4 is tagged UI, multicolor, settings and 3 more. Related tags follow; each opens its icons from every library.

Pricing

Kameleon color icons MCP, with Pro

Ask for Settings 4 or any of 400 Kameleon color icons icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.

4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • Secure checkout via Stripe
  • Code lives in your repo
  • Keep what you've shipped if you cancel
  • License terms

FAQ

Frequently asked questions

What the Settings 4 icon means and where it's used, then how to install, style and license it.

Install Settings 4 from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro