OKLCH trong CSS: Vì sao chúng tôi chuyển từ RGB/HSL

• OKLCH là một cách khai báo màu mới được thêm vào đặc tả CSS Color Module 4
  → oklch(45% 0.26 264 / 50%) : (Lightness Chroma Hue / Opacity)
• Ưu điểm của OKLCH
  • Dễ đọc hơn so với rgb/hex. Tương tự hsl nhưng mã hóa độ sáng tốt hơn
  • Không giống hsl, nó sử dụng độ sáng theo cảm nhận, nên độ tương phản có thể dự đoán được
  • Có thể dùng cho màu wide-gamut P3 (khi hiển thị nhiều màu hơn màn hình sRGB, như trên các thiết bị Apple)

Mục lục

1. CSS Color đã thay đổi như thế nào
2. So sánh OKLCH với các định dạng CSS Color khác
3. OKLCH hoạt động như thế nào
4. Cách thêm OKLCH vào dự án
5. Vì sao chúng tôi chuyển sang OKLCH
   • Cải thiện khả năng đọc
   • Thay đổi màu sắc dễ hơn
   • Hỗ trợ màu P3
   • Giao tiếp tốt hơn với đội thiết kế
   • Sẵn sàng cho tương lai