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.

1

pxToRem

The pxToRem() function helps you to convert a px unit into a rem unit,

1

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.

1

boxShadow

The boxShadow() function helps you to simply create a box shadow for an element.

1

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.

1

It can take upto two colors for creating a linear gradient background color. The angle has a default value of 310.

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.

1

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.