Inputs
Color Swatch
Selectable color tiles for skin, eyebrow and paint colors, with a blue selected ring.
Source captures·from the SEED early-access trailer
Skin color
Character creation tiles: gray tile, blue fill and outline when selected.
Skin Color
Eyebrow color
Eyebrow Color
Framed (build mode)
Interior lighting colors in the land planner use larger framed cards.
Interior Lighting
Sizes & disabled
API
| Prop | Type | Default | Description |
|---|---|---|---|
| ColorSwatchGroup.value / onValueChange | string / (v: string) => void | — | Single selection (radio group); arrow keys move between swatches. |
| ColorSwatchGroup.variant | "tile" | "frame" | "tile" | |
| ColorSwatchGroup.size | "sm" | "default" | "lg" | "default" | |
| ColorSwatch.color | string | — | Any CSS color. |
| ColorSwatch.label | string | — | Accessible name; defaults to value. |
| skinTones / eyebrowColors / lightingColors | { value, color }[] | — | Palettes sampled from the captures. |