Package Exports
- palletize
- palletize/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (palletize) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Palletize
Tools for collections of colors.
Insert a library of color swatches, then query individual or batches of swatches based on visual attributes.
Consumes a hex string for each swatch, then calculates and attaches additional data points for rgba
, hsla
, and luminance
.
Installation
Install the palletize
package
npm i palletize
Usage
- Prepare your library of swatches. Each swatch must have a unique
id
string andhex
string properties:
[
{
"id": "naturally-white",
"hex": "#fffffd",
},
{
"id": "egyptian-cotton",
"hex": "#fdfdfb",
},
{
"id": "cotton",
"hex": "#fffef9",
},
...
]
- Initialize a palette using the library:
const Palletize = require('palletize')
const Palette = Palletize(require('./natural-paint-co.json'))
- Query swatches using the fetcher methods (detailed below)
const color = Palette.id('cotton')
console.log(color)
API
id(id)
Query a single swatch by it's id
random(n = 1)
Query randomized swatches from the whole library
luminance(min, max, n = 1)
Query randomized swatches within a luminance range
hue(theta, range, n = 1)
Query randomized swatches within a range on the hue wheeltheta
: Degrees around the hue wheel 0:red -> 120:green -> 240:bluerange
: Degrees in either direction on the wheel to include in results
saturation(min, max, n = 1)
Query randomized swatches within a saturation range
lightness(min, max, n = 1)
Query randomized swatches within a lightness range
hsl(hue, saturation, lightness, n = 1)
Query randomized swatches that match the HSL rangeshue
: [theta, range]
saturation
: [min, max]
lightness
: [min, max]
Exclude
All randomized methods can provide an exclude
array as the final argument; these items are excluded from the selection process:
const background = Palette.id('cotton')
const colors = Palette.random(10, [background]) // `Cotton` swatch excluded from selection pool
Examples
Palette.id('black-robin')
Palette.random(10)
Palette.luminance(0, 0.2, 10)
Palette.luminance(0.6, 1, 10)
Palette.hue(0, 15, 10)
Palette.hue(120, 30, 10)
Palette.hue(200, 30, 10)
Palette.saturation(0.5, 1, 10)
Palette.saturation(0, 0.1, 10)
Palette.lightness(0, 0.33, 10)
Palette.lightness(0.8, 1, 10)
Palette.hsl([0, 45], [0.5, 1], [0.7, 1], 10)
Palette.hsl([150, 35], [0, 0.33], [0, 0.5], 10)
Palette.hsl(undefined, [0.5, 1], [0.5, 1], 10)