Founding price: $35, then $79.99 after 23:59 UTC on 4 November, then $79.99
Get ProA single-channel color slider (hue, saturation, brightness or alpha) whose track shows the colors you would get, built on a native range input so keyboard, touch and screen readers work.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
| Prop | Type | Description |
|---|---|---|
channel | hue, saturation, brightness, alpha | Which part of the color it edits. |
value / onChange | HSVA | The whole color; only the channel changes. |
label | string | Accessible name. Default is the channel ("Hue", "Opacity"). |
disabled | boolean |
input type="range" drawn over a gradient: Arrow keys, Page Up and Page Down, Home and End, touch and screen reader value changes all come from the browser.aria-valuetext says "120 degrees" or "40%" instead of a raw number. Give each slider a distinct name when several are on screen.dir="ltr" so the gradient and the value direction agree in right-to-left pages.The component ships with a Testing Library test (color-slider.test.tsx) that covers: its main behaviour, the keyboard path and the error or empty states.