Package Exports

typescript-color-gradient
typescript-color-gradient/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (typescript-color-gradient) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

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

MIT License

Installation

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

npm install typescript-color-gradient

Then import the module into your JavaScript:

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

Methods

Method		Description
`setGradient()`		Initializes `colorGradient` with two or more hex color values. Should always be defined.
`setNumberOfColors(n)`		Defines number of midpoints. Defaults to 10.
`getColors()`		Returns an array of hex color values .
`getColor(n)`		Returns single hex color value corresponding to the provided index.

Usage

Generate a random gradient

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

const gradientArray = new Gradient().getColors();

console.log(gradientArray);
// [... a a gradient with 10 colors starting by generating a random color and his spectrum opposite]

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

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

const gradientArray = new Gradient().setGradient("#3F2CAF").getColors();

console.log(gradientArray);
// [... a a gradient with 10 colors starting by the selected color and his spectrum opposite]

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

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

const gradientArray = new Gradient().setGradient("#3F2CAF", "e9446a").getColors();

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 { Gradient } from "typescript-color-gradient";

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

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

Using two colors and default (10) midpoints to return single hex color value corresponding to the provided index:

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

const colorAtTwo = new Gradient().setGradient("#3F2CAF", "e9446a").getColor(2);

// colors: ["#502ea8", "#6131a1", "#72339a", "#833693", "#94388d", "#a53a86", "#b63d7f", "#c73f78", "#d84271", "#e9446a"]

console.log(colorAtTwo);
// #72339a

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