Swatch 20 Solid icon - Free SVG for React, Vue, Svelte, Angular, Solid & Preact - Customizable interface vector icon

Install with shadcn CLI

npx shadcn@latest add https://www.shadcn.io/registry/heroicons-swatch-20-solid.json
npx shadcn@latest add https://www.shadcn.io/registry/heroicons-swatch-20-solid.json
pnpm dlx shadcn@latest add https://www.shadcn.io/registry/heroicons-swatch-20-solid.json
bunx shadcn@latest add https://www.shadcn.io/registry/heroicons-swatch-20-solid.json
Category:interface
Tags:swatchcolorpalettethemepickercustomizationhue

The swatch icon represents color selection and palette management with its color sample design showing hue options.

This color symbol has become the universal indicator for color pickers, theme customization, palette selection, and color management across all modern design tools and theme systems.

Frequently Asked Questions

Common questions about the Swatch 20 Solid icon

Similar Icons

Document Minus 16 Solid - actions icon from HeroIcons
document minus 16 solid
Speaker Wave 16 Solid - media icon from HeroIcons
speaker wave 16 solid
Strikethrough 16 Solid - typography icon from HeroIcons
strikethrough 16 solid
Archive Box 20 Solid - actions icon from HeroIcons
archive box 20 solid
Arrow Right Circle - navigation icon from HeroIcons
arrow right circle
Radio Solid - interface icon from HeroIcons
radio solid
Cog Solid - system icon from HeroIcons
cog solid
Globe Alt Solid - navigation icon from HeroIcons
globe alt solid
Document Text Solid - interface icon from HeroIcons
document text solid