Mô hình màu OKLCH , được quảng bá như một giải pháp đồng nhất về mặt tri giác cho thiết kế web, đang đối mặt với những chỉ trích kỹ thuật đáng kể từ các nhà phát triển khi họ phát hiện ra những hạn chế lớn trong việc triển khai thực tế. Mặc dù mô hình màu này hứa hẹn việc thao tác màu sắc dễ dàng hơn và độ sáng nhất quán trên các sắc thái khác nhau, các cuộc thảo luận trong cộng đồng đã tiết lộ những khuyết điểm nghiêm trọng đặt câu hỏi về sự sẵn sàng của nó cho việc áp dụng rộng rãi.
![]() |
---|
Slide này minh họa khái niệm về mô hình màu OKLCH và những lợi ích dự kiến của nó, tạo tiền đề cho những phê bình tiếp theo về việc triển khai thực tế |
Vấn đề gradient phơi bày những khuyết điểm cơ bản
Vấn đề quan trọng nhất tập trung vào hành vi gradient của OKLCH , tạo ra những kết quả bất ngờ và thường không thể sử dụng được. Không giống như các gradient RGB truyền thống nội suy giữa các màu theo cách có thể dự đoán được, các gradient OKLCH có thể mạo hiểm đi xa ngoài phạm vi màu sắc mà bất kỳ màn hình nào có thể hiển thị, hoặc thậm chí con người có thể nhận thức được. Điều này xảy ra bởi vì OKLCH sử dụng tọa độ cực, trong đó thành phần hue đại diện cho một góc xung quanh bánh xe màu, dẫn đến các gradient đi đường vòng quanh quang phổ màu sắc.
Vấn đề trở nên đặc biệt nghiêm trọng khi tạo gradient giữa các màu tương phản. Thay vì tạo ra các chuyển tiếp mượt mà, OKLCH có thể tạo ra những màu hợp lệ về mặt toán học nhưng không thể hiển thị về mặt vật lý, buộc các trình duyệt phải nén những màu ngoài gamut này trở lại thành các phạm vi có thể hiển thị. Việc nén này phá hủy tính đồng nhất tri giác mà OKLCH được thiết kế để cung cấp.
Phương pháp Nội suy Gradient
- OKLCH: Nội suy xung quanh cạnh của bánh xe màu, có thể vượt ra ngoài gam màu hiển thị được
- Oklab: Nội suy theo đường thẳng qua không gian màu, an toàn hơn cho việc sử dụng thực tế
- sRGB: Nội suy RGB truyền thống, có thể tạo ra các điểm giữa bị đục
- OKLCH longer hue: Phương pháp OKLCH thay thế đi theo hướng ngược lại xung quanh bánh xe màu
Hạn chế phần cứng tạo ra rào cản thực tế
Ngay cả với công nghệ hiển thị tiên tiến như màn hình DCI-P3 , các vấn đề cơ bản vẫn tồn tại. Các màu mà OKLCH có thể chỉ định thường mở rộng xa hơn những gì bất kỳ công nghệ hiển thị hiện tại hoặc có thể dự đoán nào có thể tái tạo. Một số gradient yêu cầu các màu sắc sống động gấp đôi so với khả năng vật lý có thể, tạo ra khoảng cách giữa khả năng lý thuyết của mô hình màu và các ứng dụng thực tế.
Hạn chế này ảnh hưởng đến nhiều hơn chỉ những trường hợp cực đoan. Ngay cả những kết hợp màu có vẻ hợp lý cũng có thể tạo ra gradient với những biến đổi độ sáng đáng kể và sự thay đổi màu sắc làm suy yếu lời hứa cốt lõi của mô hình về tính đồng nhất tri giác.
Độ phức tạp của chroma gây nhầm lẫn cho các nhà thiết kế
Không giống như mô hình HSL quen thuộc nơi các nhà thiết kế chủ yếu tập trung vào độ sáng và độ bão hòa, OKLCH đẩy thành phần chroma đến giới hạn kỹ thuật trong khi thực hiện những điều chỉnh bất ngờ đối với các giá trị hue. Cách tiếp cận này tạo ra sự nhầm lẫn cho các nhà thiết kế thiếu hiểu biết trực quan về cách chroma hoạt động trên các phạm vi màu khác nhau.
Chúng ta chỉ đơn giản là không hiểu Chroma một cách trực quan. Tôi đang chờ đợi OKHSL nơi các điều chỉnh sẽ nhỏ hơn nhiều và không dẫn đến những thay đổi vô lý trong ý định.
Các giá trị chroma tối đa thay đổi đáng kể tùy thuộc vào cả hue và độ sáng, tạo ra một môi trường làm việc không nhất quán đòi hỏi kiến thức lý thuyết màu sắc sâu rộng để điều hướng hiệu quả.
So sánh cấu trúc OKLCH
Thành phần | Phạm vi | Mô tả |
---|---|---|
Độ sáng | 0-1 hoặc 0%-100% | Các bước bằng nhau tạo cảm giác thay đổi độ sáng đều nhau |
Chroma | Biến đổi | Kiểm soát cường độ màu sắc, tương tự như độ bão hòa |
Hue | 0-360 độ | Kiểm soát góc màu sắc xung quanh vòng tròn màu |
so với cấu trúc HSL:
Thành phần | Phạm vi | Mô tả |
---|---|---|
Hue | 0-360 độ | Vị trí màu sắc trên vòng tròn |
Saturation | 0%-100% | Cường độ màu sắc |
Lightness | 0%-100% | Mức độ sáng |
Ngành công nghiệp tìm kiếm các giải pháp thay thế
Những thách thức với OKLCH đã khiến một số người trong ngành khám phá các lựa chọn thay thế. Tailwind CSS , một framework web phổ biến, ban đầu đã áp dụng OKLCH cho nội suy gradient trong giai đoạn beta phiên bản 4 nhưng cuối cùng đã chuyển sang Oklab như một mặc định an toàn hơn trước khi phát hành. Oklab cung cấp nhiều lợi ích tri giác của OKLCH trong khi tránh các vấn đề gradient cực đoan bằng cách nội suy theo đường thẳng thay vì xung quanh bánh xe màu.
Các nhà phát triển cũng đang kêu gọi phát triển OKHSL , điều này sẽ duy trì giao diện HSL quen thuộc trong khi kết hợp các cải tiến tri giác của họ màu sắc OK . Điều này sẽ cung cấp một môi trường làm việc trực quan hơn cho các nhà thiết kế trong khi bảo tồn các lợi thế kỹ thuật của không gian màu đồng nhất về mặt tri giác.
Cuộc thảo luận đang diễn ra làm nổi bật thách thức cân bằng giữa các cải tiến khoa học màu sắc lý thuyết với khả năng sử dụng thực tế trong quy trình thiết kế thế giới thực.
Tham khảo: What are OKLCH colors?