PostCSS plugin to create smooth linear-gradients that approximate easing functions.
See PostCSS docs for examples for your environment.
The syntax is
<gradient-type>([ <direction>,]? <start-color>, <stop-color>) where
gradient-typeis one of the supported gradient types
directionshares syntax with
linear-gradientand is optional
stop-colorare css colors in any format
Note that it's exactly two colors and it doesn't support custom color stop locations.
Scrim is a custom easing inspired by Material Design text protection scrims
precision: 0.1is the default value and creates ~17 color stops. I wouldn't recommending using anything above 0.2 as banding becomes very obvious.
alphaDecimals: 3is the default number of decimals for alpha values and I wouldn't recommend changing it. Increase it for greater precision.
You can try it out by running
npm install and
gulp in the demo folder.
Are more than welcome. Code is linted using: