UI State Palette Generator
ui_statesGenerate a complete WCAG-compliant UI state palette from a brand hex. Returns colours for: brand, hover, active, disabled, focus ring, success, warning, error, info, surface subtle, surface strong. All states computed for contrast against your background colour. Returns hex, contrast ratio, WCAG grade, and usage note for each state. Includes CSS custom properties ready to paste. Supports light and dark mode. Use before building any UI component system.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| brand_hex | Yes | Brand colour hex e.g. '#D4A829' | |
| dark_mode | No | Generate for dark mode (default false) | |
| background_hex | No | Background hex (default #FFFFFF) |
Output Schema
| Name | Required | Description | Default |
|---|---|---|---|
No arguments | |||