Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

CSS - Fonction hwb()

Description de la fonction hwb().

Attention ! Le système HWB est encore peu reconnu par les navigateurs.

La fonction hwb() définit une couleur à partir de trois paramètres qui sont la teinte, le taux de blanc et le taux de noir.

Roue des couleurs pour la fonction hwb()

Le système HWB a été développé pour qu'il soit plus intuitif de déterminer les paramètres d'une couleur ou d'ajuster une couleur. Le principe est de choisir d'abord une teinte en se basant sur une roue des couleurs comme celle qui est représentée ci-dessus (encore appelée cercle chromatique), puis d'ajouter plus ou moins de blanc et/ou de noir pour obtenir la couleur exacte recherchée.

La fonction hwb() peut être utilisée avec :

Syntaxe de la fonction hwb().

  • color: hwb(45deg, 50%, 50%); h w b

    La fonction hwb() attend trois paramètres obligatoires :

    1. h : une valeur positive ou négative avec une unité d'angle (voir les unités angulaires en CSS). Ce paramètre définit la teinte : c'est une valeur sur le cercle chromatique (roue des couleurs).
    2. w : un pourcentage de 0% à 100%. Il indique le pourcentage de blanc (white) qui compose la couleur.
    3. b : un pourcentage de 0% à 100%. Il indique le pourcentage de noir (black) qui compose la couleur.
  • color: hwb(45deg, 50%, 50%, 50%); h w b a

    La fonction hwba() attend un paramètre supplémentaire par rapport à hwb() :

    1. a : une valeur entre 0 et 1, ou un pourcentage entre 0% et code>100%. Il indique le degré d'opacité de la couleur : 0 étant une couleur totalement transparente, et 1 (ou 100%) une couleur totalement opaque.

Simulateur.

background-color:
( h w b a )

Voir aussi...

Couleurs - Propriétés.

Couleurs - Fonctions.

  • hsl() : Détermine une couleur à partir des paramètres Teinte (Hue), Saturation et Luminosité.
  • hsla() : Détermine une couleur et sa transparence à partir des paramètres Teinte (Hue), Saturation, Luminosité et Alpha.
  • hue-rotate() : Change les couleurs d'une image (rotation des teintes).
  • rgb() : Détermine une couleur à partir des valeurs de Rouge, de Vert et de Bleu.
  • rgba() : Détermine une couleur et sa transparence à partir des valeurs de Rouge, de Vert, de Bleu et de la valeur Alpha.