KQ-417 · DUOTONE/WASH
Duotone Wash
The interface mapped to a duotone: shadows to one colour, lights to another, with the gradient's angle following the pointer so the wash turns as you move. A poster's palette on a live page.
KQ-417 · DUOTONE/WASH
Basinworks · the reservoir board
Three gates, one falling head.
Storage is down since the thaw. Sweep the cursor across the board — the wash tilts with it, the same two colours reading every level underneath without hiding one of them.
68%68%41%41%12%12%
| Gate | Basin | Level | State |
|---|---|---|---|
| G1 | North basin | 68% | open |
| G2 | Mill race | 41% | throttled |
| G3 | Overflow | 12% | closed |
two colours, one angle
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/duotone-wash
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| shadow / light | string | — | The two ends of the map. |
| angle / mix / contrast | number | — | The gradient's rotation offset, how much of the original colour survives, and the tone contrast. |