Couleur Hex, RGB et RGBA dans CSS | Expliqué
Dans cet article, trois méthodes de représentation des couleurs: RGB, RGBA et Hex sont discutés. Dans CSS, RGB () est une fonction intégrée, RGBA est également un format de couleurs d'affichage avec l'extension de l'alpha. De plus, fournir des valeurs de couleur en nombres hexadécimaux est également largement utilisé dans CSS.
Fonction RGB () dans CSS
RVB est une combinaison de trois couleurs (rouge, vert et bleu) qui est utilisée dans tous les systèmes informatiques pour l'affichage coloré. Comme nous le savons, ce sont les couleurs de base et en les combinant, nous pouvons obtenir toutes les couleurs visibles dans le spectre des couleurs.
Dans CSS, ces couleurs sont définies sous la forme d'une fonction RGB (): (rouge, vert, bleu). La plage de toutes ces couleurs est définie de 0 à 255 définit l'intensité d'une couleur, et nous pouvons changer les couleurs en modifiant ces valeurs. L'intensité de ces couleurs est bien définie dans l'exemple donné.
Exemple
RVB (0, 255, 0)Cette combinaison renvoie la couleur verte car elle a la plus haute intensité et les deux autres couleurs ont 0 intensité.
En modifiant les intensités des trois couleurs, nous obtenons les différentes couleurs telles que
- RVB (255, 255, 255) affiche la couleur blanche
- et RVB (0, 0, 0) donne la couleur noire.
D'autres exemples de couleurs sont indiqués dans l'exemple donné
Exemple
RVB (0, 255, 0)
RVB (60, 60, 60)
RVB (138, 238, 130)
RVB (255, 255, 255)
Couleurs RGBA
Dans CSS RGBA est également un format pour afficher les couleurs avec l'extension de l'alpha. La structure de cette fonction de couleur est donnée ci-dessous.
RGBA (rouge, vert, bleu, alpha)Dans cette fonction, un alpha est utilisé pour exprimer l'opacité d'une couleur. Dans CSS, la propriété est utilisée pour définir la transparence d'une couleur et sa plage se situe entre 0.0 à 1.0, où 0.0 représente le totalement transparent et 1.0 représente le totalement opaque. Vous comprendrez mieux à partir de l'exemple donné.
Exemple
Vert
Vert
Vert
Vert
Vert
Dans l'exemple donné ci-dessus, nous définissons la valeur de l'alpha à partir de 0.0 (entièrement transparent) à 1.0 (entièrement opaque) et vous pouvez voir la différence d'intensité de transparence.
Couleurs hexagonales CSS
Dans CSS, les couleurs peuvent également être spécifiées avec des valeurs hexadécimales, c'est juste une autre façon de représenter les couleurs. Dans CSS, c'est le moyen le plus courant de spécifier une couleur en utilisant des valeurs hexadécimales avec un signe «#» tel que #rrggbb. Tandis que R, G, B sont les codes pour le rouge, le vert et le bleu, respectivement.
Les nombres hexadécimaux avec la combinaison de 0-9 et A-F sont utilisés pour représenter une couleur dans CSS. Quelques exemples de couleurs hexadécimales de base sont données ci-dessous:
- #ffffff: il représente la couleur blanche et
- # 000000: il représente la couleur noire.
Pour une meilleure compréhension, jetez un œil à l'exemple suivant.
Exemple
Spécifiez les couleurs en utilisant des valeurs hexagonales
# 0f4bff
# 3CB371
EE652E
# FFA500
# 6A5ACD
Dans l'exemple ci-dessus, différentes couleurs sont affichées en utilisant les valeurs hexagonales. Toutes ces valeurs hexadécimales sont la combinaison de nombres hexadécimaux, qui sont 16 valeurs alpha-nucléaires distinctes qui se trouvent entre 0 et 9 et A-F.
Conclusion
RGB, RGBA et Hex sont les différents types pour afficher les couleurs dans CSS. Alors que RVB est une combinaison de trois couleurs (rouge, vert et bleu), RGBA est le même que RVB avec l'extension de l'alpha (alpha = transperance) et Hex utilise les valeurs hexadécimales pour représenter les couleurs. La gamme de couleurs RVB et Hex se situe entre 0 et 255 entier et 00 à FF respectivement. Tous ces trois types sont bien définis avec des exemples.