sliders
Split track slider with a bar thumb
The track does not run under the thumb: it splits in two with a gap on each side, and each half takes an asymmetric radius, round on the outside and nearly square on the face pointing at the thumb. That is what makes it read as one object cut in two rather than two neighbouring bars. The thumb is a bar that narrows while you drag.
See it live and copy its promptWhat you can adjust
- Background
- Control color
- Track thickness
- Thumb height
- Gap beside the thumb
- Initial value
How this catalog works
Every component ships with its reproduction prompt: the text you paste into an AI builder to get exactly this piece. The values above are editable, and the prompt you copy carries the ones you chose, so what gets generated is what you were looking at.
