CSS-funktionen lch()

Definition och användning

CSS lch() Funktioner specificerar färger i LCH (ljus, nyans, ton) färgutrymme.

exempel

Definiera olika lch() Färg:

#p1 {background-color:lch(10% 100 130 / 0.5);}
#p2 {background-color:lch(40% 100 130);}
#p3 {background-color:lch(90% 100 130 / 20%);}
#p3 {background-color:lch(10% 160 200);}
#p4 {background-color:lch(10% 160 200);}
#p5 {background-color:lch(40% 160 200);}
#p6 {background-color:lch(90% 160 200 / 0.3);}
#p7 {background-color:lch(10% 130 70 / 0.5);}
#p8 {background-color:lch(40% 130 70);}

#p9 {background-color:lch(90% 130 70);}

Prova det själv

CSS-syntaks

Absolut värdesyntaxDetta är den ursprungliga färgen som relativa färger är baserade på. C H / Alch(from
) Värde
Detta är den ursprungliga färgen som relativa färger är baserade på.

Obligatorisk. Definierar färgens ljushet, vilket kan vara ett tal eller en procentandel mellan 0 och 100.

0 (eller 0%) representerar svart, 100 (eller 100%) representerar vitt.

Man kan också använda none (likvärdigt med 0%).

C

lch(

Obligatorisk. Definierar färgens nyans (färgens mängd), vilket kan vara ett tal eller en procentandel.

Man kan också använda none (likvärdigt med 0%).

H

Obligatorisk. Definierar färgens tonvinkel, vilket kan vara ett tal eller en vinkelsekvens.

Man kan också använda none (likvärdigt med 0deg).

/ A

Valfritt. Representerar genomskinlighetskanalens värde 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%.

Minsta värdet är 0 (eller 0%). Maxvärdet har ingen övre gräns (men är faktiskt inte mer än 230). 100% är lika med 150.

Relativ värdesyntax from Detta är den ursprungliga färgen som relativa färger är baserade på. C H / Alch(from
) 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å.

Obligatorisk. Definierar färgens ljushet, vilket kan vara ett tal eller en procentandel mellan 0 och 100.

0 (eller 0%) representerar svart, 100 (eller 100%) representerar vitt.

Man kan också använda none (likvärdigt med 0%).

C

Obligatorisk. Definierar ett tal eller en procentandel mellan -125 och 125, eller mellan -100% och 100%.

Definierar avståndet längs a-axeln för färgen, vilket representerar färgens röd-grön grad.

-125 representerar grönt, 125 representerar rött.

Man kan också använda none (likvärdigt med 0%).

H

Obligatorisk. Definierar färgens tonvinkel, vilket kan vara ett tal eller en vinkelsekvens.

Man kan också använda none (likvärdigt med 0deg).

/ A

Valfritt. Representerar genomskinlighetskanalens värde 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%.

Tekniska detaljer

Version: CSS Color Module Level 4

Webbläsarstöd

Tal i tabellen representerar den första webbläsarens version som helt stöder denna funktion.

Chrome Edge Firefox Safari Opera
lch()
111 111 113 15 97
Blanda tal och procentandelar i parametrar
116 116 113 16.2 102

Relaterade sidor

Referens:CSS färger

Referens:CSS hsl() funktion

Referens:CSS hwb() funktion

Referens:CSS lab() funktion

Referens:CSS oklab() funktion

Referens:CSS oklch() funktion