Skip to content

Procedurally generate a deterministic, perceptually distributed color palette.

License

Notifications You must be signed in to change notification settings

mapbox/to-color

Repository files navigation

@mapbox/to-color

Procedurally generate a deterministic, perceptually distributed color palette.

Build Status

install

npm install @mapbox/to-color

Usage

import toColor from '@mapbox/to-color'

const color = new toColor('tmcw');

// Or a number
// const color = new toColor(1234);
// Or with options
// const color = new toColor('tmcw', { brightness: 0.25, saturation: 1.1 });

const { hsl } = color.getColor();

/*
Returns

{
  raw: [314, 97.95, 50.98],
  formatted: 'hsl(314, 97.95%, 50.98%)'
}
*/

const { hsl } = color.getColor();

/*
Returns

{
  raw: [2, 78.26, 54],
  formatted: 'hsl(2, 78.26%, 54%)'
}
*/

Options

Option Value Default Description
brightness Number 0 Adjusts brightness percentage from the derived min/max range.
saturation Number 0 Adjusts saturation percentage from the derived min/max range.
limit Array [] Limits the higher range of hues for a given color. Options can be red, orange, yellow, green, blue, purple, or pink.

Developing

# Demo site
npm install & npm start

# Run tests
npm run test

Credit v2 is adapted from randomColor.

About

Procedurally generate a deterministic, perceptually distributed color palette.

Topics

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Packages

No packages published