Một bạn sinh viên chọn bảng màu “bổ túc” rất chuẩn sách giáo khoa: đỏ và xanh lá, cùng độ bão hoà. Đặt chữ đỏ lên nền xanh lá, cả lớp nheo mắt vì chữ “rung” và khó đọc. Chụp ảnh đen trắng, chữ và nền gần như biến thành một mảng xám đều.
Vòng màu cho biết màu nào đứng cạnh nhau thì hài hoà theo sắc độ. Nó không nói gì về việc hai màu đó có tách được nhau hay không. Việc tách được — tạo hình, tạo chữ đọc được, tạo phân cấp — phụ thuộc chủ yếu vào độ sáng (value). Đây là lý do người làm nghề lâu năm thường chốt sáng tối trước rồi mới chọn màu.
Ba thuộc tính của một màu
- Sắc độ (hue): tên màu — đỏ, cam, vàng, lam.
- Độ bão hoà (saturation, chroma): màu rực hay xỉn, gần với xám tới đâu.
- Độ sáng (value, lightness): màu gần trắng hay gần đen.
Trong ba thuộc tính, mắt người nhạy nhất với độ sáng khi nhận ra hình và chữ. Ta đọc được một trang báo in đen trắng dễ dàng; ta sẽ gặp khó nếu mọi chữ và nền có cùng độ sáng dù khác màu.
Phép thử thang xám
Cách đơn giản nhất để thấy độ sáng: chuyển bản thiết kế sang thang xám (grayscale). Bạn hỏi ba câu:
- Chữ còn đọc được không?
- Phần tử quan trọng nhất có còn nổi nhất không?
- Có bao nhiêu mức xám tách biệt rõ? (Lý tưởng là 3–5 mức, không phải 12 mức gần nhau.)
Nếu bản xám đứng vững, màu gần như chắc chắn sẽ đứng vững. Nếu bản xám sập, không phối màu nào cứu được.
Vì sao cùng “độ sáng 50%” mà màu vàng sáng hơn màu lam
Nhiều người dùng mô hình HSL trong phần mềm và nghĩ rằng giữ nguyên chỉ số L (lightness) thì các màu sẽ sáng như nhau. Thực tế không phải vậy. Ở cùng L = 50% trong HSL, màu vàng thuần trông sáng hơn hẳn màu lam thuần. Lý do: HSL là mô hình hình học dựa trên RGB, không tính tới việc mắt người nhạy với các bước sóng khác nhau.
Các không gian màu cảm nhận (perceptual) như CIELAB hay OKLCH được thiết kế để chỉ số độ sáng gần với cảm nhận của mắt hơn. Nhiều công cụ thiết kế và trình duyệt hiện đại đã hỗ trợ OKLCH. Khi cần dựng một dải màu nhiều bậc (ví dụ mười bậc từ nhạt tới đậm cho một hệ giao diện), dựng trong không gian cảm nhận sẽ cho các bậc đều mắt hơn nhiều so với kéo thanh L trong HSL.
| Mô hình | Ưu | Nhược | Dùng khi |
|---|---|---|---|
| HSL / HSB | Dễ hiểu, có trong mọi phần mềm | Độ sáng không đều giữa các sắc độ | Chọn nhanh, thử ý tưởng |
| CIELAB | Độ sáng gần cảm nhận, dùng trong quản lý màu in | Khó hình dung, một số vùng không đều | Đo và đối chiếu màu in |
| OKLCH | Độ sáng và sắc độ tách bạch, dải màu đều | Một số màu vượt ngoài gam màn hình | Dựng dải màu cho hệ giao diện |
Quy trình phối màu theo sáng độ trước
- Phác bằng xám. Dựng bố cục chỉ bằng 3–4 mức xám: nền, khối phụ, khối chính, chữ. Quyết định cái gì sáng nhất, cái gì tối nhất.
- Gán sắc độ vào từng mức. Giờ mới hỏi: nền nên ấm hay lạnh? Khối chính mang màu thương hiệu nào?
- Giữ độ sáng khi đổi màu. Khi chọn màu cho một mức, so thang xám của màu đó với mức xám ban đầu. Phần mềm có công cụ đo độ sáng, hoặc đơn giản là chuyển xám để so.
- Điều chỉnh bão hoà sau cùng. Dành màu rực nhất cho điểm nhấn. Phần diện tích lớn nên dùng màu ít bão hoà hơn.
Tương phản đồng thời: màu thay đổi theo hàng xóm
Một ô xám giữa đặt trên nền đen trông sáng hơn chính ô xám ấy đặt trên nền trắng. Một ô xám đặt trên nền đỏ ngả sang xanh lục nhạt. Josef Albers đã dành cả một cuốn sách với hàng trăm bài tập để chứng minh rằng màu “không bao giờ được thấy như nó vốn là”.
Hệ quả thực tế: đừng duyệt màu trên một ô mẫu cô lập. Luôn duyệt màu trong bố cục thật, cạnh những màu sẽ đứng bên nó. Một màu nhấn chọn trên nền trắng của bảng chọn màu có thể trông khác hẳn khi đặt trên nền kem của ấn phẩm.
Lỗi hay gặp
- Chọn màu từ vòng màu mà quên độ sáng, như cặp đỏ – xanh lá cùng sáng ở đầu bài.
- Quá nhiều màu cùng độ sáng trung bình. Bảng màu “pastel toàn bộ” trông dễ thương nhưng không có điểm nhấn.
- Chữ màu trên nền màu cùng sáng. Ví dụ chữ cam trên nền hồng.
- Tin chỉ số HSL. Dựng thang màu bằng cách tăng L đều 10%, kết quả là bậc nhạt thì gần nhau, bậc đậm thì nhảy vọt.
Bài tập: bốn mức xám, ba bảng màu
- Dựng một tấm thiệp mời đơn giản chỉ bằng bốn mức xám: 95%, 70%, 40%, 10% độ sáng.
- Làm ba phiên bản màu: một bảng ấm, một bảng lạnh, một bảng gồm một màu nhấn trên nền trung tính.
- Với mỗi phiên bản, chuyển sang thang xám và đặt cạnh bản bốn mức xám gốc. Chúng phải gần như giống nhau.
- Phiên bản nào lệch nhiều nhất? Tìm màu gây lệch và sửa độ sáng của nó.
Làm bài này vài lần, bạn sẽ bắt đầu “nhìn thấy” độ sáng của màu mà không cần chuyển xám — kỹ năng mà họa sĩ vẫn luyện bằng cách vẽ nghiên cứu sáng tối trước khi lên màu.
Việc nên làm ngay: mở bản thiết kế gần nhất của bạn, chuyển thang xám và đếm số mức xám tách biệt. Nếu con số dưới ba, bạn đã biết vì sao nó trông nhòe.
Câu hỏi thường gặp
Độ sáng của màu là gì?
Là mức gần trắng hay gần đen của một màu, độc lập với sắc độ. Đây là thuộc tính quyết định chữ và hình có tách khỏi nền hay không.
Vì sao chữ đỏ trên nền xanh lá khó đọc?
Vì hai màu thường có độ sáng gần nhau nên mắt khó tách, đồng thời hai sắc độ đối nhau đứng sát tạo cảm giác rung. Chuyển thang xám sẽ thấy chúng gần thành một mảng.
HSL và OKLCH khác nhau thế nào?
HSL là mô hình hình học từ RGB, độ sáng không đều giữa các màu. OKLCH là không gian cảm nhận, chỉ số độ sáng gần với mắt người hơn nên dựng dải màu đều hơn.
Có nên dùng vòng màu để phối màu không?
Nên dùng để chọn quan hệ sắc độ, nhưng phải kiểm độ sáng bằng thang xám. Vòng màu không đảm bảo khả năng đọc và phân cấp.
Tương phản đồng thời là gì?
Là hiện tượng một màu trông khác đi tuỳ màu xung quanh. Vì vậy cần duyệt màu trong bố cục thật chứ không duyệt trên ô mẫu riêng lẻ.