CSS HSL farver
- Forrige side CSS HEX farver
- Næste side CSS baggrund
HSL værdi
I CSS kan du bruge farvetone, farvesaturation og lysstyrke (HSL) til at specificere farve, formatet er som følger:
hsla(nyans, mål, ligthed)
Farvetone (nyans)er grader fra 0 til 360 på farverhjulet. 0 er rød, 120 er grøn, og 240 er blå.
Farvesaturation (mål)er en procentsats, 0% betyder grå skygger, mens 100% er fuldfarve.
Lysstyrke (ligthed)er også en procentsats, 0% er sort, 50% er ikke mørk eller lys, og 100% er hvid.
Prøv følgende HSL-værdier til eksperimentering:
NYANS
MÅL
LIGHED
Eksempel
Farvesaturation
Farvesaturation kan beskrives som farvens styrke.
100% er ren farve, uden grå skygger
50% er 50% grå, men du kan stadig se farve.
0% er fuldstændig grå, og du kan ikke se farve.
Eksempel
Lysstyrke
Farvens lysstyrke kan beskrives som hvor meget lys der gives til farven, hvor 0% betyder ikke lys (sort), 50% betyder 50% lys (ikke mørk eller lys), og 100% betyder fuld lys (hvid).
Eksempel
Normalt defineres grå skygger ved at sætte farvetone og farvesaturation til 0, og justere lysstyrke fra 0% til 100% for at få dybere/længere skygger:
Eksempel
HSLA værdi
HSLA farveværdi er en udvidelse af HSL-farveværdi med Alpha-kanal - den specificerer farvens uigennemsigtighed.
HSLA farveværdi specificeret som:
hsla(nyans, mål, ligthed, alpha)
alpha Parametrene er tal mellem 0.0 (fuldstændig gennemsigtig) og 1.0 (ikke gennemsigtig):
Prøv følgende HSLA-værdier for eksperimentering:
NYANS
MÅL
LIGHED
ALPHA
Eksempel
- Forrige side CSS HEX farver
- Næste side CSS baggrund