Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 
 
 

resemble-image

Provide color stops for a gradient that loosely resembles the original image.

This package contains the algorithms getEqualWidthStops and getVariableWidthStops as described in Thoughts on Linear Gradients That Resemble Images.

getEqualWidthStops(), getVariableWidthStops(), Original

npm install resemble-image --save-dev
import { getEqualWidthStops, getVariableWidthStops } from 'resemble-image';
var getEqualWidthStops = require('resemble-image').getEqualWidthStops;
var getVariableWidthStops = require('resemble-image').getVariableWidthStops;

Each function returns a promise, which resolves in an array of color–position pairs.

getEqualWidthStops(image, { fidelity: 4 }).then((stops) => console.log(stops));
// [ { color: '#023d33', position: 0 },
//   { color: '#036357', position: 25 },
//   { color: '#91aaa5', position: 50 },
//   { color: '#cdcfd5', position: 75 } ]

getVariableWidthStops(image, { fidelity: 4 }).then((stops) => console.log(stops));
// [ { color: '#043630', position: 9.77 },
//   { color: '#02554b', position: 33.79 },
//   { color: '#c4c6dd', position: 67.97 },
//   { color: '#c4c6dd', position: 95.31 } ]

Documentation

About

Provide color stops for a gradient that loosely resembles the original image.

Resources

License

Releases

No releases published

Packages

No packages published