CSS lab() fonksiyonu

tanımı ve kullanımı

CSS'nin lab() fonksiyonları, CIE Lab renk alanında renkleri belirtir. Bu renk alanı, insan gözünün görebileceği tüm renkleri temsil eder.

örnekleri

Farklı lab() Renk:

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

Kişisel olarak deneyin

CSS dilimi

Mutlak değer dilimi

lab(L a b / A)
Değer Açıklama
L

Gerekli. Renkinin parlatıcılığını tanımlar, 0 ila 100 arasındaki sayı veya yüzdeliktir.

0 (veya 0%) siyahı, 100 (veya 100%) beyazı temsil eder.

Ayrıca none (0% eşdeğeridir) kullanılabilir.

a

Gerekli. -125 ile 125 arasındaki sayı veya -100% ile 100% arasındaki yüzdelik değerleri tanımlar.

Renkinin a eksenine olan uzaklığı tanımlar, renkinin kırmızı-yeşil derecesini belirtir. -125 yeşili, 125 kırmızıyı temsil eder.

Ayrıca none (0% eşdeğeridir) kullanılabilir.

b

Gerekli. -125 ile 125 arasındaki sayı veya -100% ile 100% arasındaki yüzdelik değerleri tanımlar.

Renkinin b eksenine olan uzaklığı tanımlar, renkinin sarı-mavi derecesini belirtir.

-125 maviyi, 125'yi sarıyı temsil eder.

Ayrıca none (0% eşdeğeridir) kullanılabilir.

/ A

Opsiyonel. Renkinin şeffaflık kanalı değerini belirtir (0% veya 0, tamamen şeffaf; 100% veya 100, tamamen şeffaf olmayan).

Ayrıca none (şeffaflık kanalını temsil eder) kullanılabilir.

Varsayılan değeri %100'dür.

Nispi değer dilimi

lab(from color L a b / A)
Değer Açıklama
from color

Anahtar kelime 'from' ile başlar, ardından temel renk değerini belirten renk değeri gelir.

Bu, nispi renklerin temel aldığı temel renktir.

L

Gerekli. Renkinin parlatıcılığını tanımlar, 0 ila 100 arasındaki sayı veya yüzdeliktir.

0 (veya 0%) siyahı, 100 (veya 100%) beyazı temsil eder.

Ayrıca none (0% eşdeğeridir) kullanılabilir.

a

Gerekli. -125 ile 125 arasındaki sayı veya -100% ile 100% arasındaki yüzdelik değerleri tanımlar.

Renkinin a eksenine olan uzaklığı tanımlar, renkinin kırmızı-yeşil derecesini belirtir.

-125 yeşili, 125'yi kırmızıyı temsil eder.

Ayrıca none (0% eşdeğeridir) kullanılabilir.

b

Gerekli. -125 ile 125 arasındaki sayı veya -100% ile 100% arasındaki yüzdelik değerleri tanımlar.

Renkinin b eksenine olan uzaklığı tanımlar, renkinin sarı-mavi derecesini belirtir.

-125 maviyi, 125'yi sarıyı temsil eder.

Ayrıca none (0% eşdeğeridir) kullanılabilir.

/ A

Opsiyonel. Renkinin şeffaflık kanalı değerini belirtir (0% veya 0, tamamen şeffaf; 100% veya 100, tamamen şeffaf olmayan).

Ayrıca none (şeffaflık kanalını temsil eder) kullanılabilir.

Varsayılan değeri %100'dür.

Teknik ayrıntılar

Sürüm: CSS Color Module Level 4

Tarayıcı desteği

Tabloda gösterilen sayılar, bu fonksiyonu tamamen destekleyen ilk tarayıcı sürümünü belirtir.

Chrome Edge Firefox Safari Opera
lab()
111 111 113 15 97
Parametrelerde sayı ve yüzdelik birleştirme
116 116 113 16.2 102

İlgili sayfalar

Kaynakça:CSS Renkleri

Kaynakça:CSS hsl() fonksiyonu

Kaynakça:CSS hwb() fonksiyonu

Kaynakça:CSS lch() fonksiyonu

Kaynakça:CSS oklab() fonksiyonu

Kaynakça:CSS oklch() fonksiyonu