color-between
get a gradient color between two colors
Last updated 3 years ago by laispace .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install color-between 
SYNC missed versions from official npm registry.

color-between

NPM version Build status Test coverage Downloads

get a gradient color between two colors.

Installation

$ npm install color-between --save

Usage

get a middle color between two hsl color, with default 0.5 gradient degree:

const colorBetween = require('color-between');

colorBetween('hsl(0, 100%, 100%)', 'hsl(100, 0%, 0%)');
// equal: colorBetween('hsl(0, 100%, 100%)', 'hsl(100, 0%, 0%)', 0.5, 'hsl');
// output: 'hsl(50, 50%, 50%)'

get a color between two colors with a gradient degree:

const colorBetween = require('color-between');

// rgb format
colorBetween('rgb(255, 255, 255)', 'rgb(0, 0, 0)', 0.5, 'rgb');
// output: 'rgb(128, 128, 128)'

// rgba format
colorBetween('rgba(255, 255, 255, .2)', 'rgba(0, 0, 0, .8)', 0.5, 'rgb');
// output: 'rgba(128, 128, 128, 0.5)

// hex format
colorBetween('#fff', '#000', 0.5, 'hex');
// output: '#808080'

// mixed format
colorBetween('#fff', 'rgb(0, 0, 0)', 0.5, 'hsl');
output: 'hsl(0, 0%, 50%)'

API

colorBetween(startColor, endColor, gradientDegree, outputFormat) => color:String

startColor:String and endColor:String

valid color string (eg, hsl(0, 100%, 100%), rgb(100, 100, 100), rgba(0, 0, 0, 0.5), #fff). Also, support input of color package.

gradientDegree:Number

valid number between 0 and 1 (eg, 0.5).

outputFormat:String

output string format type, support these format:

  • hsl
  • rgb
  • hex

color:String

return a color string with outputFormat format type.

Test

npm i
npm test

Current Tags

  • 1.0.2                                ...           latest (3 years ago)

3 Versions

  • 1.0.2                                ...           3 years ago
  • 1.0.1                                ...           3 years ago
  • 1.0.0                                ...           3 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (1)
Dev Dependencies (4)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |