The Tabler color swatch icon visually represents a selection of colors, commonly used in interfaces to indicate color choices, palettes, or design options.
Common uses
- Color picker component
- Theme selection setting
- Design tool palette
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconColorSwatch } from '@tabler/icons-react';
<IconColorSwatch size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Design
- Keywords
- samplechoiceselectioncolorswatchcreativeartisticvisualaestheticstyledesigncolor samplepaint chiphue selector
FAQ
- What is the color swatch icon used for?
- It's used to represent color selection, palettes, or design-related options within a user interface.
- How do I use this icon in React?
- Import it using `import { IconColorSwatch } from '@tabler/icons-react';` and render it as a component.
- What is the license for this icon?
- The Tabler icon set, including the color swatch icon, is distributed under the MIT license.
Related icons
The same idea in other libraries, and near matches in Tabler.
Looking for something else? Search Tabler and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →