Skip to content

Scheme

Generate color schemes based on color theory harmonies.

scheme(input: string, schemeOrOptions?: Scheme | SchemeOptions): string[]
ParameterDescriptionTypeDefault
formatOutput formatColorType
schemeThe scheme to generateSchemecomplementary
type Scheme =
| 'analogous'
| 'complementary'
| 'rectangle'
| 'split'
| 'split-complementary'
| 'square'
| 'tetradic'
| 'triadic';

Two colors opposite on the color wheel.

import { scheme } from 'colorizr';
scheme('#ff0044'); // ['#ff0044', '#00ffbb']

Playground

Three adjacent colors on the color wheel.

scheme('#ff0044', 'analogous'); // ['#ff00c3', '#ff0044', '#ff3c00']

Playground

Base color plus two colors adjacent to its complement.

scheme('#ff0044', 'split'); // ['#ff0044', '#00ff3c', '#00c3ff']

Playground

Three colors evenly spaced (120 degrees apart).

scheme('#ff0044', 'triadic'); // ['#ff0044', '#44ff00', '#0044ff']

Playground

Four colors forming a rectangle on the wheel.

scheme('#ff0044', 'tetradic'); // ['#ff0044', '#ffbb00', '#00ffbb', '#0044ff']

Playground

Four colors evenly spaced (90 degrees apart).

scheme('#ff0044', 'square'); // ['#ff0044', '#c3ff00', '#00ffbb', '#3c00ff']

Playground