Color Buddy Docs

Appearance

color-buddy-palette ​

This package is a collection of tools for working with color palettes. It is built on top of the Color library. Palette lint's usage is centered around Color library, that, in turn wraps the extremely powerful colorjs.io.

Installation ​

You can install it with

bash
npm install color-buddy-palette

Contents ​

This library contains the following functions:

clipToGamut ​

Function: clipToGamut(color: Color) => [number, number, number]

Description: Clips a color to the gamut of its color space. Return the clipped color as an array of channels in the originating color space.

cvdSim ​

Function: cvdSim(deficiency: string, color: Color) => Color

Description: Simulate the appearance of a color under a color vision deficiency. Code adapted from libDaltonLens https://daltonlens.org DLDeficiency = "normal" | "protanopia" | "protanomaly" | "deuteranopia" | "deuteranomaly" | "tritanopia" | "tritanomaly" | "achromatopsia" | "achromatomaly"

distributePoints ​

Function: distributePoints(dir: Object, focusedColors: number[], colors: Color[], colorSpace: "cam16-jmh" | "hct" | "hsl" | "hsv" | "jzazbz" | "lab" | "lch" | "oklch" | "rgb" | "srgb") => Color[]

Description: Distributes colors in a palette along a direction in color space. The direction can be horizontal, vertical, or in z space.

makePalFromString ​

Function: makePalFromString(strings: string[], bg: string) => Palette

Description: Creates a palette from an array of strings. The background color can be specified as a string. Generates palette in CIE LAB space

toPal ​

Function: toPal(colors: string[], currentPal: Palette, colorSpace: any) => Palette

Description: Converts an array of hex strings to a palette.

This library contains the following types:

ColorSpace ​

Type: ColorSpace: keyof typeof ColorSpaceDirectory

Description: A collection of color space that are usable with this color library.

PalType ​

Type: PalType: "sequential" | "diverging" | "categorical"

Palette ​

Type: Palette: Pal<Color, Color>

Description: A palette where the colors are represented as Color objects. Good for programmatic use.

StringPalette ​

Type: StringPalette: Pal<Object, string>

Description: A palette where the colors are represented as strings. Good for serialization or storage. Expects color to be represented as {color: string, tags: string[]} objects.

This library contains the following classes:

Color ​

The base class for all color spaces

Class: Color

Description: The base class for all color spaces

Constructor: Constructor: constructor(ConstructorSignature new Color: Color)

Properties: Property channels: Record<string, number> Property spaceName: "cam16-jmh" | "hct" | "hsl" | "hsv" | "jzazbz" | "lab" | "lch" | "oklch" | "rgb" | "srgb" Property tags: string[]

Non-static: Method copy: copy() => ColorMethod deltaE: deltaE(color: Color, algorithm: DistAlgorithm) => numberMethod distance: distance(color: Color, space: string) => numberMethod fromChannels: fromChannels(channels: Channels) => ColorMethod fromString: fromString(colorString: string, allowError: boolean) => ColorMethod getChannel: getChannel(channel: string) => numberMethod inGamut: inGamut() => booleanMethod luminance: luminance() => numberMethod prettyChannels: prettyChannels() => string[]Method setChannel: setChannel(channel: string, value: number) => ColorMethod stringChannels: stringChannels() => string[]Method symmetricDeltaE: symmetricDeltaE(color: Color, algorithm: DistAlgorithm) => numberMethod toChannels: toChannels() => ChannelsMethod toColorIO: toColorIO() => ColorMethod toColorSpace: toColorSpace(colorSpace: "cam16-jmh" | "hct" | "hsl" | "hsv" | "jzazbz" | "lab" | "lch" | "oklch" | "rgb" | "srgb") => ColorMethod toDisplay: toDisplay() => stringMethod toHex: toHex() => stringMethod toPrettyString: toPrettyString() => stringMethod toString: toString() => string

Static: Property advancedSpace: boolean Property axisLabel: Function Property channelNames: string[] Property colorFromChannels: Function Property colorFromHex: Function Property colorFromString: Function Property description: string Property dimensionToChannel: Record<"x" | "y" | "z", string> Property domains: Domain Property isPolar: boolean Property name: string Property stepSize: Channels Property stringToChannels: Function Property toColorSpace: Function Description: Convert a color string to a color object

Method stringIsColor: stringIsColor(str: string, spaceName: string) => boolean

Usage ​

Example usage of the library:

ts
import { makePalFromString, Color } from "color-buddy-palette";

const stringColors = [
  "lab(50% 0 0)",
  "lab(100.00000139649632% -0.000007807961277528364 0.000006766250648659877)",
  "oklab(1.000000009791752,-3.3637913787742946e-8,6.836016341882356e-8)",
  "rgb(86,17,229)",
  "red",
];
const background = "black";

const palette = makePalFromString(stringColors, background);
// convert to LCH space
const newPal = {
  ...palette,
  colors: palette.colors.map((color) => color.toColorSpace("lch")),
};

const newColor = Color.colorFromString("#ff0000").toColorSpace("lch");
newPal.colors.push(newColor);