Couleur aléatoire en @function SCSS
Pour générer une couleur aléatoire en SCSS, nous nous basons sur la fonction native random()
, qui sera exécutée trois fois pour le niveau de rouge, de vert, et de bleu.
Attention, contrairement à une @mixin qui ajoute une ou plusieurs propriétés à une élément, une @function SCSS se charge uniquement de renvoyer un résultat.
@function randomColor(){
$red: random(256)-1;
$green: random(256)-1;
$blue: random(256)-1;
@return rgb($red, $green, $blue);
}
Usage
.random-bg{
background: randomColor();
}
.random-color{
color: randomColor();
}