@pbroom/color-kitInterpolation

InterpolationOptions

Options accepted by mix(), interpolate(), and generateScale().

interfaceimport type { InterpolationOptions } from '@pbroom/color-kit';index.ts:69
interface InterpolationOptions {
  space?: InterpolationSpace;
  hue?: HueInterpolationMethod;
  premultiplied?: boolean;
}

Properties

space?InterpolationSpacedefault 'oklch'
Space to interpolate in.
hue?HueInterpolationMethoddefault 'shorter'
Hue interpolation method for polar spaces. Ignored for rectangular spaces.
premultiplied?booleandefault true` for rectangular spaces, `false` for `'oklch'

Interpolate with premultiplied alpha, as CSS color-mix() does. Hue is never premultiplied.

Defaults to true for rectangular spaces (matching CSS) and false for 'oklch', so { space: 'oklch' } keeps the straight-alpha channel interpolation of the option-less call. Pass true with 'oklch' for full CSS parity when the endpoints have different alphas.

Where the interpolated alpha is exactly 0 (both endpoints transparent, or extrapolation), there is nothing to un-premultiply by, so that result uses straight-alpha interpolation of the channels. CSS Color 4 (and colorjs.io) instead keep the premultiplied values there, which collapses every fully transparent result to transparent black. The two agree on everything visible; color-kit keeps the hue and lightness so a transparent stop is not silently turned into black.