Better check gradient-js.
This module creates css gradient output for gradient.js modules.
gradient.js is a javascript module that takes your source colors array and configuration object, and returns a gradient suitable for your needs.
Gradient maker uses chroma-js color manipulation library for gradient generation (Copyright (c) 2011-2017, Gregor Aisch).
const css = new Css()
const gradient = css.get([
[100, 34, 230, 0.5],
[10, 33, 20, 0.6],
[1, 12, 12, 0.3]
],{
base: {
interpolation: 'linear',
mode: 'rgb',
samples: 40,
lightnessCorrection: true
},
css: {
type: 'radial',
top: 30,
left: 20,
shape: 'circle'
}
})
{
type: 'linear' | 'radial'
angle?: number // between 0 and 359
shape: 'ellipse' | 'circle'
top?: number
left?: number
extent?: 'farthest-side' | 'closest-side' | 'farthest-corner' | 'closest-corner'
}
The angle
is ommited when the type
is set to radial
.
The extent
keyword is ignored if the shape is set to the circle
and the type
is set to linear
.
When you set the type
to radial
, you must provide valid shape
property.