deepcolour
is a stateful library for the parsing, processing and formatting of RGBA colours, as well as vector spaces.
- All Colour values unclamped and normalized to
0-1
. - Most operations are in-place.
- Stateful HSV properties.
- Conversion to and from CSS.
const Colour = require('deepcolour')
let colour = new Colour(1,0,0,1)
console.log( colour.hex )
// #ff0000
// make colour cyan by shifting hue
colour.hue = 0.5
console.log( colour.hex )
// #00ffff
// Set the colour with a string
colour.set('white')
// Retrieve value and saturation
console.log( colour.value, colour.saturation )
// 1,0
- red : RGB red value.
- green : RGB green value.
- blue : RGB blue value.
- alpha : Alpha value.
- hue : HSV hue. The range of the HSV colour circle is
0-1
. See Hue Preservation. - saturation : HSV saturation.
- value : HSV value.
- hex : CSS hexadecimal color.
#112233
- css : CSS color. If the colour can be represented as a hexadecimal color,
hex
will be returned. Otherwise a CSSrgb()
orrgba()
will be returned.
All methods beginning with set may be chained together.
set ( anything ) Safely calls other set function based on type.
setDefault () Sets the colour to opaque black, [0,0,0,1]
.
setArguments ( arguments ) Sets from an arguments object. The following formats are supported:
( [ red [, green [, blue, [, alpha ] ] ] )
( 'string' [, alpha ] )
set8BitArray ( Array-like )
Set from an array of numbers in the range 0-255. Up to four values will be read, in the order RGBA. This method will also work for slices of Buffer
objects, allowing it to work with image libraries such as png-js. Throws error on invalid input.
setRGB ( Number, Number, Number ) Sets red, green and blue values. If non-numeric values are passed, existing values are preserved.
setHSV ( Number, Number, Number ) Sets hue, saturation and value values. If non-numeric values are passed, existing values are preserved.
setKeys ( object ) Sets properties from an object. The following keys are supported: ['red','r','green','g','blue','b','alpha','a','hue','h','saturation','sat','s','value','v','hex','css']
setAlpha ( Number ) Set alpha value.
setRandom () Set red, green and blue to random values in standard range.
setChannel ( index, Number) Set the channel index
to a value.
setChannelSafe ( index, Number) Set the channel index
to a value, ignoring invalid channels.
setChannelHex ( index, String ) Set the channel index
to a hexadecimal value. The string may be 1 or 2 digits.
toString () Alias for toCSSUnclamped
toHexString () '#ff00ff'
CSS hex, clamped with no alpha.
toRGBA () [1,0,1,1]
Raw values.
toObject () { r: 1, g: 0, b: 1, a: 1}
Raw values.
toBuffer () Buffer.from([255,0,255,255])
Clamped, 8-bit values.
to8BitArrays ( length ) [255,0,255,255]
Clamped, 8-bit values.
toHexChannels ( 'rgbahsv' ) 'ff00ffd4ffff'
Clamped, 8-bit values from RGB and HSV as hex.
toCSS ( format = 'auto' | 'rgba' | 'hex' | 'unclamped' ) CSS in given format.
toCSSRGBA () 'rgb(255,0,255)'
Clamped, 8-bit values with auto adding alpha.
toCSSUnclamped () 'rgba(1024,0,1024,1)'
Unclamped values in CSS range, always has alpha.
- isBlack () -> bool
red == 0 && green == 0 && blue == 0
- isGray () -> bool
red == green == blue
In HSV & HLS colour spaces, hue and saturation can be invalid when the colour is grey or black. In purely functional colour conversions, this results in saturation
being lost when value == 0
and hue
being lost when saturation == 0
. This is particularly annoying in stateful system, where value
or saturation
are being modulated.
deepcolour
compensates for this by holding hue
and saturation
values.
// Initialize a new Colour
let colour = new Colour('green')
assert.equal( colour.hue, 1/3)
// Set the colour to black
colour.value = 0
assert( colour.isBlack() )
// Since it does not matter when value is 0,
// hue is preserved.
assert.equal( colour.hue, 1/3)
// We can set the hue, as well.
colour.hue = 1/6
// Colour is still black
assert( colour.isBlack() )
// But the hue is preserved
assert.equal( colour.hue, 1/6)
// Set the colour back to full intensity
colour.value = 1
// Is now yellow
assert.equal( colour.hex, '#ffff00' )
By default deepcolour
creates a colour space with rgba
properties. The library can also be used to create and manipulate arbitrary vector spaces, with or without colour properties.
const { Space } = require('deepcolour')
const Vector = Space({
rgba: false,
channels: 'xyz'
})
let vec = Vector.add( [ 1, 0, 0 ], { y: 0.5 } )
assert.deepEqual( vec.toArray(), [ 1, 0.5, 0 ] )
const { Space } = require('deepcolour')
const Vertex = Space({
rgba: 5,
channels: 'xyzuvrgba'
})
let vert = new Vertex( { x: 3, y: 2, z: 1 } )
// All colour manipulation methods may be used.
vert.set('cyan')
vert.alpha = 0.5
assert.deepEqual( vert.toArray(), [ 3, 2, 1, 0, 0, 0, 1, 1, 0.5 ] )