Extract color palettes from images.
Simple use, < 5ko minified, fast process and no dependencies for browser.
Dependency to canvas for node.js
Install
For browser
npm install extract-colors
For node.js
Need to install dependency canvas
npm install extract-colors canvas
Usage
Browser
import extractColors from 'extract-colors'
const src = 'my-image.jpg'
extractColors(src)
.then(console.log)
.catch(console.error)
Node.js
const path = require('path')
const { extractColors } = require('extract-colors')
const src = path.join(__dirname, './my-image.jpg')
extractColors(src)
.then(console.log)
.catch(console.log)
Options
const src = 'my-image.jpg'
const options = {
pixels: 10000,
distance: 0.2,
saturationImportance: 0.2,
splitPower: 10,
colorValidator: (red, green, blue, alpha = 255) => alpha > 250
}
extractColors(src, options)
.then(console.log)
.catch(console.error)
pixels
Total pixel number of the resized picture for calculation
Type: Integer
Default: 10000
distance
From 0 to 1 is the color distance to not have near colors (1 distance is between white and black)
Type: Number
Default: 0.2
saturationImportance
Power of the saturation weight during the process (0 is not used, 1 is only saturation and not area size)
Type: Number
Default: 0.2
splitPower
Approximation power in the first color splitting during process (from 2 to 16)
Type: Integer
Default: 10
colorValidator
Enable only some colors
Type: Function
Default: (red, green, blue, alpha = 255) => alpha > 250
crossOrigin
Only for browser, can be 'Anonymous' to avoid CORS
Type: String
Default: null
Return of the promise
Array of colors with the followed properties:
[
{
hex: '#62342b',
red: 98,
green: 52,
blue: 43,
area: 0.5915,
saturation: 0.2156862
},
...
]
Field | Example | Type | Description |
---|
hex | #62342b | String | color in hexadecimal string |
red | 98 | Integer | red canal from 0 to 255 |
green | 52 | Integer | green canal from 0 to 255 |
blue | 43 | Integer | blue canal from 0 to 255 |
area | 0.5915 | Number | area of the color and his neighbouring colors from 0 to 1 |
saturation | 0.2156862 | Number | color saturation from 0 to 1 |