gpotter-gradient v0.1.0

gpotter-gradient

Get color of linear gradient at a certain step

Installation npm package

npm install gpotter-gradient

Usage npm package

const getColorFromGradient = require('gpotter-gradient').default;
const gradient = {
  0: '#ff3336',
  41: '#4a2138',
  60: '#aa7acc',
  100: '#0091ff'
};

const color = getColorFromGradient(gradient, 27); // #882737

Usage browser library

<script src="dist/gpotter-gradient.client.js"></script>
<script>
const gradient = {
  0: '#ff3336',
  41: '#4a2138',
  60: '#aa7acc',
  100: '#0091ff'
};

const color = getColorFromGradient(gradient, 33); // #6d2538
</script>

Input gradient format

You can use several color notations to specify gradient

const gradient = {
  0: '#ff3336',
  60: '#aa7acc',
  100: '#0091ff'
};

const gradient = {
  0: '#fa0',
  60: '#08f',
  100: '#a7f'
};

const gradient = {
  0: 'darkorchid',
  60: 'blue',
  100: 'orchid'
};

Output color format

Output color format in #rrggbb notation

Tests

You can run tests in npm: npm run test

Or you can test visually in the browser by using html files in "view" directory.