color-kitnext

@pbroom/color-kitScale

generateScale

Generate a color scale (array of colors) between two endpoints. The scale includes both endpoints.

functionimport { generateScale } from '@pbroom/color-kit';index.ts:122
function generateScale(
  from: Color,
  to: Color,
  steps: number,
  options?: InterpolationOptions,
): Color[];

Parameters

fromColor
Starting color
toColor
Ending color
stepsnumber
Number of colors in the scale (minimum 2)
options?InterpolationOptions
Interpolation options forwarded to interpolate()

Returns

Color[]

Example

TypeScript
import { generateScale, parse, toHex } from '@pbroom/color-kit';

generateScale(parse('#f00'), parse('#00f'), 5).map(toHex);
// → ['#ff0000', '#e8007b', '#ba00c2', '#7a00f4', '#0000ff']
generateScale(parse('#f00'), parse('#00f'), 5, { space: 'linear-srgb' }).map(toHex);
// → ['#ff0000', '#e10089', '#bc00bc', '#8900e1', '#0000ff']