Proportional Slider

Split a fixed total across colored segments with draggable dividers.

Playground

Drag a divider to redistribute between two neighbors. Segment count, minimum value mode, and read-only are configurable.

25 · 25 · 25 · 25

External inputs

Pair the slider with inputs. setSegmentValue keeps earlier fields fixed and rebalances only trailing segments (West absorbs the remainder when North, East, and South are set).