Thư viện thuật ngữ / Màu sắc

OKLCH là gì?

Còn gọi: oklab

OKLCH là hệ màu theo cảm nhận (dựa trên Oklab) mô tả màu bằng độ sáng (L), độ rực (C) và sắc độ (H), được thiết kế để các thay đổi số trông đều với mắt người; nay đã được CSS hỗ trợ.

Ảnh minh hoạ OKLCH: hai thang màu 10 bậc cùng sắc: một làm bằng HSL (độ sáng nhảy không đều), một bằng OKLCH (đều mắt)
Hai thang màu 10 bậc cùng sắc: một làm bằng HSL (độ sáng nhảy không đều), một bằng OKLCH (đều mắt)

Hiểu kỹ hơn

So với HSL, OKLCH cho độ sáng nhất quán hơn giữa các sắc màu, nên rất hợp để tạo thang màu cho design system, chế độ sáng tối và gradient không bị xỉn ở giữa. OKLCH cũng mô tả được các màu ngoài dải sRGB trên màn hình P3. Ví dụ CSS: color: oklch(70% 0.15 40). Khi màu vượt dải màn hình hỗ trợ, trình duyệt sẽ tự đưa về màu gần nhất.