All examples By author By category About

FraserChapman

linear gradient with draggable stops.

Linear gradient with stops offset proportionally to the input domain value they represent.

For example given the domain: [0, 5, 10, 50, 100] And the range: ["#190729", "#191996", "#2F972F", "#FFFF66", "#FF1919"] The stops would be offset by: 0%, 5%, 10%, 50%, 100%

The colour at the percentage offset is represented by the hex value at the same index position in the scheme, colours between stops are interpolated in a linear fashion.

When a scheme is selected a random domain is generated and the gradient is redrawn using it. Information on the current domain and selected range is given along with the stop percentages and the domain values that they correspond to.

Aditionally the axis ticks can be dragged horizontally to alter the gradient.