CSS oklab() funktion

definition og brug

CSS' oklab() Funktioner bruges til at specificere farver i OKLAB-farverummet. Dette farverummet er designet til at simulere menneskets syn på farver.

eksempler

Definere forskellige oklab() Farve:

#p1 {background-color:oklab(0 40% 20% / 0.5);}
#p2 {background-color:oklab(0.3 -40% -20%);}
#p3 {background-color:oklab(0.4 30% -20% / 20%);}
#p4 {background-color:oklab(0.5 60% 20%);}
#p5 {background-color:oklab(0.6 50% -10%);}
#p6 {background-color:oklab(0.7 70% -80% / 0.3);}
#p7 {background-color:oklab(0.8 70% 20% / 0.5);}
#p8 {background-color:oklab(0.9 80% -20%);}
#p9 {background-color:oklab(1 90% -100%);}

Prøv det selv

CSS-sprog

Absolut værdisprog

oklab(L a b / A)
Værdi Beskrivelse
L

Obligatorisk. Definerer farvens opfattede lysstyrke, som kan være et tal mellem 0 og 1 eller en procentdel mellem 0% og 100%.

0 (eller 0%) betyder sort, 1 (eller 100%) betyder hvid.

Man kan også bruge None (lige med 0%).

a

Obligatorisk. Definerer et tal mellem -0.4 og 0.4 eller en procentdel mellem -100% og 100%.

Definerer afstanden til farven langs a-aksen, som viser farvens røde-grønne grad.

-0.4 betyder grøn, 0.4 betyder rød. Man kan også bruge none (lige med 0%).

b

Obligatorisk. Definerer et tal mellem -0.4 og 0.4 eller en procentdel mellem -100% og 100%.

Definerer afstanden til farven langs b-aksen, som viser farvens gule-blå grad.

-0.4 betyder blå, 0.4 betyder gul. Man kan også bruge none (lige med 0%).

/ A

Valgfri. Angiver værdien for farveens transparentkanal (0% eller 0 betyder fuldstændig gennemsigtig, 100% eller 100 betyder fuldstændig uigennemsigtig).

Man kan også bruge none (som betyder ingen transparentkanal). Standardværdien er 100%.

Relativ værdisprog

oklab(from color L a b / A)
Værdi Beskrivelse
from color

Begynder med nøglen from, efterfulgt af farveværdien, der repræsenterer den oprindelige farve.

Dette er den oprindelige farve, som relative farver er baseret på.

L

Obligatorisk. Definerer farvens opfattede lysstyrke, som kan være et tal mellem 0 og 1 eller en procentdel mellem 0% og 100%.

0 (eller 0%) betyder sort, 1 (eller 100%) betyder hvid.

Man kan også bruge none (lige med 0%).

a

Obligatorisk. Definerer et tal mellem -0.4 og 0.4 eller en procentdel mellem -100% og 100%.

Definerer afstanden til farven langs a-aksen, som viser farvens røde-grønne grad.

-0.4 betyder grøn, 0.4 betyder rød. Man kan også bruge none (lige med 0%).

b

Obligatorisk. Definerer et tal mellem -0.4 og 0.4 eller en procentdel mellem -100% og 100%.

Definerer afstanden til farven langs b-aksen, som viser farvens gule-blå grad.

-0.4 betyder blå, 0.4 betyder gul. Man kan også bruge none (lige med 0%).

/ A

Valgfri. Angiver værdien for farveens transparentkanal (0% eller 0 betyder fuldstændig gennemsigtig, 100% eller 100 betyder fuldstændig uigennemsigtig).

Man kan også bruge none (som betyder ingen transparentkanal). Standardværdien er 100%.

Tekniske detaljer

Version: CSS Color Module Level 4

Browserunderstøttelse

Tallene i tabellen viser den første browserversion, der fuldt ud understøtter denne funktion.

Chrome Edge Firefox Safari Opera
oklab()
111 111 113 15.4 97
Bland brug af tal og procenter i parametrene
116 116 113 16.2 102

Relaterede sider

Reference:CSS farver

Reference:CSS hsl() funktion

Reference:CSS hwb() funktion

Reference:CSS lch() funktion

Reference:CSS lab() funktion

Reference:CSS oklch() funktion