CSS Couleurs RGB


Valeur RGB

Une valeur de couleur RGB représente les sources de lumière ROUGE, VERTE et BLEUE.

En CSS, une couleur peut être spécifiée sous forme de valeur RGB, en utilisant cette formule :

rgb( rouge, vert , bleu )

Chaque paramètre (rouge, vert et bleu) définit l'intensité de la couleur entre 0 et 255.

Par exemple, rgb(255, 0, 0) s'affiche en rouge, car le rouge est réglé à sa valeur maximale (255) et les autres sont réglés à 0.

Pour afficher le noir, réglez tous les paramètres de couleur à 0, comme ceci : rgb(0, 0, 0).

Pour afficher le blanc, réglez tous les paramètres de couleur à 255, comme ceci : rgb(255, 255, 255).

Expérimentez en mélangeant les valeurs RGB ci-dessous :

ROUGE

255

VERT

0

BLEU

0

Exemple

rgb(255, 0, 0)
rgb(0, 0, 255)
rgb(60, 179, 113)
rgb(238, 130, 238)
rgb(255, 165, 0)
rgb(106, 90, 205)

Essayez-le vous-même »

Les nuances de gris sont souvent définies en utilisant des valeurs égales pour les 3 sources de lumière :

Exemple

rgb(60, 60, 60)
rgb(90, 90, 90)
rgb(120, 120, 120)
rgb(180, 180, 180)
rgb(210, 210, 210)
rgb(240, 240, 240)

Essayez-le vous-même »


Valeur RGBA

Les valeurs de couleur RGBA sont une extension des valeurs de couleur RGB avec un canal alpha, qui spécifie l'opacité d'une couleur.

Une valeur de couleur RGBA est spécifiée comme suit :

rgba( rouge, vert , bleu, alpha )

Le paramètre alpha est un nombre compris entre 0.0 (totalement transparent) et 1.0 (pas du tout transparent) :

Expérimentez en mélangeant les valeurs RGBA ci-dessous :

ROUGE

255

VERT

0

BLEU

0

ALPHA

0

Exemple

rgba(255, 99, 71, 0)
rgba(255, 99, 71, 0.2)
rgba(255, 99, 71, 0.4)
rgba(255, 99, 71, 0.6)
rgba(255, 99, 71, 0.8)
rgba(255, 99, 71, 1)

Essayez-le vous-même »


Vidéo : Couleurs CSS RGB & RGBA