Functions
We've created a set of predefined helper functions that can help you for creating differnt sort of thing in a better and simple way.
rgba
The rgba()
function helps you to create a rgba color code.
pxToRem
The pxToRem()
function helps you to convert a px
unit into a rem
unit,
It will divide each number by the base number which is 16 by default.
hexToRgb
The hexToRgb()
function helps you to change the hex
color code to rgb
using chroma-js library.
boxShadow
The boxShadow()
function helps you to simply create a box shadow for an element.
The offset
and radius
should be an array, the color
should be a hex
color code, the opacity
should be a number between 0 and 1 and the inset
should be a string with the value of "inset"
linearGradient
The linearGradient()
function helps you to simply create a linear gradient background color.
It can take upto two colors for creating a linear gradient background color. The angle
has a default value of 195.
gradientChartLine
The gradientChartLine()
function helps you to simply create a gradient color for the lines of a chart. The only use case of that helper function is for the chart components.
The chart
should be the reference of the chart element, the color
should be a hex
color code that you want to use it for the color of the lines in a chart and the opacity
should be a number between 0 and 1 by default it has a value of 0.2.