javascript-color-gradient

javascript-color-gradient

Lightweight JavaScript library, used to generate an array of color gradients by providing start and finish colors, as well as the required number of midpoints.

Demo

https://codesandbox.io/s/sharp-benz-csgfd

Installation

npm install javascript-color-gradient

Usage

import Gradient from "javascript-color-gradient";

const colorGradient = new Gradient();

const color1 = "#3F2CAF";
const color2 = "#8BC2E3";

colorGradient.setGradient(color1, color2);

Methods

setGradient(color1, color2) - sets two or more hex color values. Should always be defined.

setMidpoint(n) - sets the number range to n. By default n is 10.

getArray() - returns an array of hex colors. Requires no parameters.

getColor(n) - returns certain hex color, where n is a requested number of midpoint colors.

console.log(colorGradient.getArray()); // outputs ["#4e4ab9", "#5d68c4", "#6d86ce", "#7ca4d9", "#8bc2e3"]
console.log(colorGradient.getColor(3)); // outputs #6d86ce

Example

Implementing javascript-color-gradient library into React.js application, using two gradient colors and 10 midpoints.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

javascript-color-gradient is MIT licensed.