Color Curves

Unique color palettes for data visualization and generative art. This is the library that underlies color-curves-app

Editor

An interactive editor is available at colorcurves.app. You may find it easiest to create palettes with the editor first, then bring them into your projects using this library (instructions for how to do so are in the application).

Install

npm install color-curves -s

Include

Modules (all exports are named):

import { ColorPalette } from 'color-curves';

Common JS

const ColorCurves = require('color-curves');

Script

<script src="http://unpkg.com/color-curves"></script>
<script>
const palette = new ColorCurves.ColorPalette()
</script>

Usage

Create a new palette using custom curves

const hsCurve = new Exponential({ variation: 'in-out' });
const lCurve = new Polynomial({ variation: 'in', exponent: 2 });
const palette = new ColorPalette(hsCurve, lCurve, { start: 0.25, end: 0.75 });

Get color values

palette.hslValueAt(.33);
palette.hexValueAt(.66);
palette.rgbValueAt(.99);

Draw a palette on a canvas

const canvas = document.createElement('canvas');
document.body.appendChild(canvas);

palette.drawContinuousPalette(canvas, 128);
palette.drawDiscretePalette(canvas, 6);

API / Documentation

Check out the full documentation