CÁCH LỰA CHỌN VÀ CHUYỂN MÀU SẮC SANG CHẾ ĐỘ NỀN TỐI

CÁCH LỰA CHỌN VÀ CHUYỂN MÀU SẮC SANG CHẾ ĐỘ NỀN TỐI
Không phải tất cả các màu đều có thể phù hợp với background tối, bởi vì với mỗi màu khác nhau sẽ có độ tương phản và bão hòa khác nhau. Nếu UI Designer không nhạy bén thì rất dễ gây ra khó chịu cho người dùng.
Hãy cùng Capi Demy tìm hiểu cách sử dụng màu phù hợp với background tối nhé!


Không phải màu sắc nào cũng có thể sử dụng để hiển thị màn hình web/app ở chế độ nền tối, đặc biệt là những màu sắc có độ bão hoà cao. Độ bão hoà (Saturation) là cụm từ để chỉ mức độ sử dụng màu sắc nhất định, hay còn để thể hiện mức độ đậm nhạt của một màu sắc. Mức độ bão hoà càng cao thì màu sắc sẽ càng tươi và rực rỡ. Nhưng khi bạn đặt các màu như vậy trên nền đen, giao diện thiết kế sẽ trông rất khó nhìn, thậm chí tạo cảm giác mỏi và nhức mắt cho người xem do hiện tượng "bị cháy", mất nét của sắc độ bão hoà quá cao. Bạn có thể nhận thấy điều đó rất rõ ở ví dụ trên.

Hãy tạo một lớp màu trắng thuần #FFFFFF nhưng có độ trong suốt nhất định (Opacity < 100%) để chèn đè lên màu sắc đang có độ bão hoà cao. Từ đó, bạn sẽ có ngay một màu mang độ bão hoà thấp hơn, hiển thị rõ ràng và thuận mắt hơn với chế độ nền tối nhưng vẫn theo chuẩn tông màu thiết kế của web/app đó.

Bảng màu đơn sắc (Monochromatic color pallete) là bảng màu bao gồm các sắc độ, tông màu sáng tối khác nhau của một màu.

Nếu chia sắc độ bão hoà của một màu thành 10 mức, thì các màu sáng ở giữa mức 01 và mức 05 sẽ phù hợp với chế độ nền tối, giúp người dùng dễ nhìn và dễ đọc.

Các UI Designer đã nắm vững được cách lựa chọn và chuyển màu sắc sang chế độ nền tối để áp dụng vào các dự án thiết kế của mình chưa? Thực hành ngay thôi nào!
Tổng hợp bởi đội ngũ Capi Demy.
Nếu bạn có câu hỏi nào đừng ngần ngại kết nối với đội ngũ Capi Demy nhé, chúng mình luôn ở đây và làm điểm tựa vững chắc cho các bạn!
Thông tin liên hệ tư vấn:
Fanpage: Capi Demy
Email: capidemy@gmail.com
Website:
Capidemy.vn
Capidemy.com
Địa chỉ:
Cơ sở 1 HN: Tầng 6, số 35 Tô Vĩnh Diện, Khương Trung, Thanh Xuân, Hà Nội
Cơ sở 2 HN: Tầng 2 số 2 ngách 28, ngõ 93, Hoàng Văn Thái, Thanh Xuân, Hà Nội.


