ColorSwatch
data-displayColor palette swatch grid with selection state, optional labels and hex values, role=listbox pattern, and token-driven styling. Supports selected ring, scale hover, and checker pattern for alpha colors.
Import
typescript
import { ColorSwatch } from "packages/ui/src";Props
ColorSwatchProps
| Prop | Type | Required |
|---|---|---|
colors | ColorSwatchColor[] | Yes |
selected | string | No |
onSelect | (color) => void, showLabel?: boolean | No |
Examples
Color Swatch
Color palette swatches with selection, labels, and hex values.