kursplan

CSS referens manual

CSS egenskap

Valfria kurser

Kursrekommendation:

CodeW3C.com's kista

CSS-funktionen hwb()

Föregående sida CSS hue-rotate() funktion
Nästa sida CSS hypot() funktion
Gå tillbaka till föregående nivå CSS funktion referens manual

Definition och användning

CSS hwb() Funktionen använder färgmodellen ton-hårdhet-mörkhet (HWB) för att specificera färger. Det kan också läggas till en valfri genomskinlighetsskanal (som representerar färgens genomskinlighet).

Exempel

Definiera olika HWB(A)-färger:

#p1 {background-color:hwb(60 40% 20% / 0.5);}
#p2 {background-color:hwb(120 40% 20%);}
#p3 {background-color:hwb(120 40% 20% / 20%);}
#p4 {background-color:hwb(240 40% 20%);}
#p5 {background-color:hwb(240 50% 10%);}
#p6 {background-color:hwb(240 40% 20% / 0.3);}
#p7 {background-color:hwb(300 40% 20% / 0.5);}
#p8 {background-color:hwb(360 40% 20%);}
#p9 {background-color:hwb(360 90% 0%);}

Prova själv

CSS-syntax

Absolut värdesyntax

hwb(hue whiteness blackness / A)

Värde	Beskrivning
hue	Obligatoriskt. Definierar vinkeln på färgcirkeln (0 till 360) - 0 (eller 360) är röd, 120 är grön, 240 är blå. Man kan också använda none (likvärdigt med 0deg).
whiteness	Obligatoriskt. Definierar mängden vitt i blandningen; 0% representerar ingen vitt, 100% representerar fullständig vitt. Man kan också använda none (likvärdigt med 0%).
blackness	Obligatoriskt. Definierar mängden mörkhet i blandningen; 0% representerar ingen mörkhet, 100% representerar fullständig mörkhet. Man kan också använda none (likvärdigt med 0%).
/ A	Valfritt. Representerar kanalvärdet för genomskinlighet för färgen (0% eller 0 representerar helt genomskinlig, 100% eller 100 representerar helt opåverkad). Man kan också använda none (som representerar ingen genomskinlighet). Standardvärdet är 100%.

Relativ värdesyntax

hwb(from color whiteness blackness / A)

Värde	Beskrivning
from color	Börjar med nyckelordet from, följt av färgvärdet som representerar den ursprungliga färgen. Detta är den ursprungliga färgen som relativa färger är baserade på.
hue	Obligatoriskt. Definierar vinkeln på färgcirkeln (0 till 360) - 0 (eller 360) är röd, 120 är grön, 240 är blå. Man kan också använda none (likvärdigt med 0deg).
whiteness	Obligatoriskt. Definierar mängden vitt i blandningen; 0% representerar ingen vitt, 100% representerar fullständig vitt. Man kan också använda none (likvärdigt med 0%).
blackness	Obligatoriskt. Definierar mängden mörkhet i blandningen; 0% representerar ingen mörkhet, 100% representerar fullständig mörkhet. Man kan också använda none (likvärdigt med 0%).
/ A	Valfritt. Representerar kanalvärdet för genomskinlighet för färgen (0% eller 0 representerar helt genomskinlig, 100% eller 100 representerar helt opåverkad). Man kan också använda none (som representerar ingen genomskinlighet). Standardvärdet är 100%.