Couleurs HTML | RVB, Hex, HSL a expliqué
Cet article montrera comment ajouter des couleurs à un élément / document HTML. Il fournira un aperçu général des conventions en couleur de base comme «noms de couleurs», «valeurs RVB», «valeurs hexadécimales», etc. Alors, commençons!
Noms de couleurs HTML
La première façon d'implémenter les couleurs HTML est simplement d'utiliser le nom de couleur i.e. Mots anglais pour la couleur comme le vert, le jaune, le rouge, etc. HTML prend en charge plus d'une centaine de noms de couleurs standard.
Exemple
Supposons que nous ayons un paragraphe dans notre HTML:
Un paragraphe
Pour lui donner une couleur, disons le vert, nous pouvons faire ceci:
Un paragraphe
Couleur hexadécimale HTML
HTML prend en charge une autre façon d'ajouter des couleurs I.e. les valeurs hexadécimales. Les valeurs hexadécimales peuvent être écrites à l'aide de seize chiffres 0-9 et A-F. Il est déterminé par un «#”Symbole suivi de trois ou six chiffres. Par exemple: #Rrggbb. Ici, les deux premiers emplacements représentent le rouge, les deux emplacements adjacents montrent le vert et les deux derniers montrent la valeur bleue.
Exemple
Supposons que nous ayons un paragraphe dans notre HTML:
Un paragraphe
Cette fois, nous essaierons de définir la couleur d'arrière-plan de
Tag à gris à l'aide de valeurs hexadécimales et nous pouvons le faire en utilisant le code HTML de ligne suivant:
Un paragraphe
Dans le code ci-dessus, «# e3e3e3» est le code hexagonal de couleur gris.
Les valeurs hexadécimales peuvent être écrites en utilisant seulement trois chiffres au lieu de six chiffres. Par exemple, la valeur hexadécimale # F00 produira la même couleur que # FF0000.
Couleurs HTML RVB
Une autre méthode la plus fréquemment utilisée pour les couleurs est les valeurs RVB. Il faut trois valeurs i.e. Rouge, vert et bleu. Au lieu d'utiliser les étranges numéros hexadécimaux, la propriété RVB utilise des nombres de 0 à 255. Ces nombres déterminent l'intensité de chaque paramètre de couleur, par exemple, pour utiliser la couleur noire définir tous les paramètres sur 0 i.e. RVB (0, 0, 0). Le RVB (0, 0, 255) affichera la couleur bleue et ainsi de suite.
Exemple
Prenons le même paragraphe:
Un paragraphe
Maintenant, nous allons essayer de définir sa couleur d'arrière-plan sur Orange en utilisant les valeurs RVB et nous pouvons le faire en utilisant le code HTML de ligne suivant:
Un paragraphe
Dans le code ci-dessus, «RVB (255, 165, 0)» est les valeurs RVB pour la couleur orange.
Couleurs HTML RGBA
Les valeurs RGBA sont une extension des valeurs de couleur RGB où «UN»Représente le canal alpha qui spécifie l'opacité d'une couleur. Un paramètre alpha est un nombre entre 0 (transparent) et 1 (opaque).
Exemple
Cet exemple montre comment le paramètre alpha "UN«Sera spécifié:
Un paragraphe
Le code donné ci-dessus a implémenté le paramètre alpha sur
élément. Maintenant, le résultat sera en fonction de la quantité de transparence comme indiqué dans la sortie suivante:
Couleurs HTML HSL
HTML fournit une autre convention de couleur I.E HSL détermine une couleur avec sa teinte, sa saturation et sa lumière. Éventuellement, il peut également avoir un paramètre alpha.
- Le terme teinte détermine un ange dans la roue chromatique e.g. 0 ou 360 degrés représentent la couleur rouge, de même, les couleurs restantes sont séparées autour du cercle. Par exemple, le vert est égal à 120 degrés, le cyan est égal à 180 degrés, etc.
- Tandis que la deuxième valeur en HSL est la saturation qui détermine l'intensité de la couleur et est représentée par un% de signe.
- La troisième valeur est la légèreté qui détermine les niveaux de légèreté représentés par le signe%.
Par exemple, cent pour cent signifie la pleine lumière i.e. blanc tandis que zéro pour cent signifie pas de lumière i.e. noir, et ainsi de suite.
Exemple
Le script ci-dessous implémentera la convention HSL Color sur différents éléments HTML:
Un paragraphe
Nous obtiendrons la sortie suivante pour le code ci-dessus:
Conclusion
HTML fournit plusieurs conventions en couleur pour définir la couleur du texte, la couleur d'arrière-plan, etc. Il existe quatre façons de colorer un élément HTML: nom de couleur, valeurs RVB, valeurs hexadécimales et valeurs HSL. Pour définir la couleur à l'aide de «Nom de couleur», spécifiez le nom de la couleur i.e. Rouge, Vert. Pour RVB, combinez les valeurs de couleur rouge, vert et bleu entre 0 et 255. Pour la couleur hexadécimale, écrivez un code couleur à trois ou six chiffres. Pour HSL, définissez les valeurs de teinte, de saturation et de lumière.