Fungsi lab() CSS

Definisi dan penggunaan

Definisi dan penggunaan CSS lab() Fungsi di ruang warna CIE Lab menentukan warna. Ruang warna ini mewakili semua warna yang dapat dilihat mata manusia.

contoh

Tentukan lab() Warna:

#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%);}

Coba sendiri

Syntaks CSS

Syntaks absolut

lab(L a b / A)
Nilai Deskripsi
L

Diperlukan. Mendefinisikan kecerahan warna, dapat berupa angka di antara 0 sampai 100 atau persen.

0 (atau 0%) menunjukkan hitam, 100 (atau 100%) menunjukkan putih.

Juga dapat digunakan none (sama dengan 0%).
a

Diperlukan. Mendefinisikan angka di antara -125 sampai 125 atau persen di antara -100% sampai 100%.

Mendefinisikan jarak warna sepanjang sumbu a, menunjukkan tingkat merah-hijau warna. -125 menunjukkan hijau, 125 menunjukkan merah.

Juga dapat digunakan none (sama dengan 0%).
b

Diperlukan. Mendefinisikan angka di antara -125 sampai 125 atau persen di antara -100% sampai 100%.

Mendefinisikan jarak warna sepanjang sumbu b, menunjukkan tingkat kuning-hijau warna.

-125 menunjukkan biru, 125 menunjukkan kuning.

Juga dapat digunakan none (sama dengan 0%).
/ A

Pilihan. Menunjukkan nilai jalan transparensi warna (0% atau 0 menunjukkan transparen yang penuh, 100% atau 100 menunjukkan transparen yang tidak ada).

Juga dapat digunakan none (menunjukkan jalan transparensi yang tidak ada).

Nilai default adalah 100%.

Syntaks nilai relatif

lab(from color L a b / A)
Nilai Deskripsi
from color

Dimulai dengan kata kunci from, diikuti dengan nilai warna yang mewakili warna asli.

Ini adalah warna asli yang berdasarkan warna yang relatif.
L

Diperlukan. Mendefinisikan kecerahan warna, dapat berupa angka di antara 0 sampai 100 atau persen.

0 (atau 0%) menunjukkan hitam, 100 (atau 100%) menunjukkan putih.

Juga dapat digunakan none (sama dengan 0%).
a

Diperlukan. Mendefinisikan angka di antara -125 sampai 125 atau persen di antara -100% sampai 100%.

Mendefinisikan jarak warna sepanjang sumbu a, menunjukkan tingkat merah-hijau warna.

-125 menunjukkan hijau, 125 menunjukkan merah.

Juga dapat digunakan none (sama dengan 0%).
b

Diperlukan. Mendefinisikan angka di antara -125 sampai 125 atau persen di antara -100% sampai 100%.

Mendefinisikan jarak warna sepanjang sumbu b, menunjukkan tingkat kuning-hijau warna.

-125 menunjukkan biru, 125 menunjukkan kuning.

Juga dapat digunakan none (sama dengan 0%).
/ A

Pilihan. Menunjukkan nilai jalan transparensi warna (0% atau 0 menunjukkan transparen yang penuh, 100% atau 100 menunjukkan transparen yang tidak ada).

Juga dapat digunakan none (menunjukkan jalan transparensi yang tidak ada).

Nilai default adalah 100%.

Detil teknis

Versi: CSS Color Module Level 4

Dukungan browser

Angka di tabel menunjukkan versi browser yang sepenuhnya mendukung fungsi ini.

Chrome Edge Firefox Safari Opera
lab()
111 111 113 15 97
Campur angka dan persen di parameter
116 116 113 16.2 102

Halaman yang berhubungan

Referensi：Warna CSS

Referensi：Fungsi hsl() CSS

Referensi：Fungsi hwb() CSS

Referensi：Fungsi lch() CSS

Referensi：Fungsi oklab() CSS

Referensi：Fungsi oklch() CSS