Which way hue travels in the cylindrical spaces -- oklch, lch,
hsl, hwb. Default: "shorter", and no effect on the other spaces.
"longer" takes the other way round the hue circle, so red to green
passes through blue; "increasing" always ascends, wrapping past 360
degrees, and "decreasing" always descends. An unrecognized name is
ignored, as with CanvasGradient.interpolation.
🧪 Not in the HTML Canvas standard.
Color space the gradient's stops are blended in. Default: "srgb".
The default is the canvas's own space under another name: it reads back
as "srgb", and on an sRGB canvas -- the default -- the two are the
same thing. The perceptual spaces are what to reach for when a two-color
ramp goes muddy in the middle; oklab and oklch hold lightness even
across the blend where sRGB's midpoint darkens.
An unrecognized name is ignored and the current setting kept, as an attribute setter is expected to do.
🧪 Not in the HTML Canvas standard.
Adds a color stop with the given color to the gradient at the given offset. 0.0 is the offset at one end of the gradient, 1.0 is the offset at the other end.
An offset outside 0.0..=1.0 throws a RangeError, and a color that
will not parse throws a TypeError -- plain JavaScript errors rather
than the DOMExceptions a browser raises, there being no DOM here.
The color may also be a [r, g, b, a] array of premultiplied
linear-light floats, which no browser accepts.
An opaque object describing a gradient. It is returned by the methods CanvasRenderingContext2D.createLinearGradient() or CanvasRenderingContext2D.createRadialGradient().
MDN Reference