math.random() returns a random decimal number between 0 and 1.
You can pass an argument as a limit and the function will return a random decimal number between 0 and the limit passed.
math.random($limit: null) //or random($limit: null)
Click on the SCSS and Result tabs 👇 interchangeably and you’ll see the div in different shape each time.
We can create a random posts listing like this:
When to use it?
If you’re going to compile the SCSS into CSS and ship it then the random() function won’t work since by the time you compile into CSS, the values are fixed.
So, if you need random value each time user refreshes the browser page, I would advise not to use SCSS random() function but go with PHP or other server side or just client side random function.
If you just need random values one time and then use those for a project, go for SCSS random() function.
examples functions random sass