typescript-color-gradient

Typescript Color Gradient

All credits to Adrinlol, original creator of this simple yet amazing library

typescript-color-gradient is a typescript native fork of javascript-color-gradient, a 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.

For the original creator of the library, this is the repository

Installation

For Node.js: Install the typescript-color-gradient npm module:

npm install typescript-color-gradient

Then import the module into your JavaScript:

import { generateGradient } from  from "typescript-color-gradient";

Usage

Generate a random gradient

import { generateGradient } from  from "typescript-color-gradient";

const gradientArray = generateGradient();

console.log(gradientArray);
// [... a gradient with 10 colors starting by generating a random color and his complementary hex string value]

Using 1 colors and default (10) midpoints to generate an array of hex color values:

import { generateGradient } from  from "typescript-color-gradient";

const gradientArray = generateGradient(["#3F2CAF"]);

console.log(gradientArray);
// [... a gradient with 10 colors starting by the selected color and his complementary hex string value]

Using 2 colors and default (10) midpoints to generate an array of hex color values:

import { generateGradient } from  from "typescript-color-gradient";

const gradientArray = generateGradient(["#3F2CAF", "#e9446a"]);

console.log(gradientArray);
// ["#502ea8", "#6131a1", "#72339a", "#833693", "#94388d", "#a53a86", "#b63d7f", "#c73f78", "#d84271", "#e9446a"]

Using 4 colors and 20 midpoints to generate an array of hex color values :

import { generateGradient } from  from "typescript-color-gradient";

const gradientArray = generateGradient(["#3F2CAF", "#e9446a", "#edc988", "#607D8B"], 20);

console.log(gradientArray);
// ["#5930a5", "#72339a", "#8c3790", "#a53a86", "#bf3e7b", "#d84271", "#e94b6c", "#ea5f70", "#ea7375", "#eb8779", …]

Migrating to V4

It just goes from

import { Gradient } from "typescript-color-gradient";

const gradientArray = new Gradient()
  .setGradient("#3F2CAF", "#e9446a", "#edc988", "#607D8B")
  .setNumberOfColors(20)
  .getColors();

console.log(gradientArray);

to

import { generateGradient } from  from "typescript-color-gradient";

const gradientArray = generateGradient(["#3F2CAF", "#e9446a", "#edc988", "#607D8B"], 20);

console.log(gradientArray);

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

typescript-color-gradient is MIT licensed.

Quotes

Again thanks to Adrinlol for his work and letting me fork his job. If anyone wants to contribute with a donation, i kindly ask to send it to The original creator