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.