Anatomy
import { ColorField } from "chroma-panel";
<ColorField label="Hex" withAlpha />;See parsing for what it accepts.
Only inside a panel
This is one of the parts the built-in modes are made of. It reads the colour
through usePanel(), so it only works inside a ChromaPanel — typically in a
custom mode. For a picker outside the panel, use the
store and hooks.
API reference
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | 'Hex' | The label beside the field. |
| withAlpha | boolean | false | Accept and show the alpha channel, so #3366ccff round-trips. |
| className | string | — | Class on the field. |