ColorSwatch
ColorSwatch Component
Playground
Props
| Prop | Type | Default | Value |
|---|---|---|---|
| color | color | — | |
| label | text | — | |
| size | selectsm | md | lg | — | |
| showHex | boolean | — |
Default
Sizes
Palette
#ef4444
#22c55e
#3b82f6
| PROP | TYPE | DEFAULT | DESCRIPTION |
|---|---|---|---|
color | color | — | Swatch color |
label | text | — | Label text |
showHex | boolean | — | Show hex value |
size | select | — | Swatch size |
Using ColorSwatchtsx
import { ColorSwatch } from '@/components/ColorSwatch'
<ColorSwatch
color="..."
label="..."
size="..."
showHex="..."
/>Tokens Used
No design tokens detected