Làm thế nào để làm cho một màu xuất hiện giống nhau trên các nền khác nhau?


16

Bối cảnh về nhận thức màu sắc:

Do bản chất của mắt người và bộ não xử lý hình ảnh, có một ảo ảnh quang học rằng cùng một màu sẽ trông khác nhau tùy thuộc vào nền .

Nó được gọi là hiệu ứng tương phản , được minh họa dưới đây - hình chữ nhật trung tâm giống hệt nhau:

nhập mô tả hình ảnh ở đâyNguồn: Wikimedia

Một minh họa (và báo cáo) của NASA làm cho hiệu ứng của màu nền càng rõ hơn:

nhập mô tả hình ảnh ở đây

nhập mô tả hình ảnh ở đâyNguồn: Phòng thí nghiệm nghiên cứu sử dụng màu của NASA

(Lưu ý cách hai màu trên cùng trong hình ảnh thứ hai xuất hiện giống nhau, nhưng thực sự hoàn toàn khác nhau.)


Thiết kế web thì sao?

Câu hỏi của tôi liên quan đến thiết kế web, đặc biệt trong trường hợp này, màu sắc của văn bản liên kết trên các nền khác nhau.

Đối với một màu văn bản nhất định, làm thế nào người ta có thể tìm thấy màu bổ sung để làm cho nó xuất hiện giống nhau trên một nền nhất định?


Chúng ta hãy xem một ví dụ cho câu hỏi này:

Hãy xem xét ví dụ của tôi dưới đây, với văn bản màu vàng #FFF000trên các nền sau:

  • trắng #FFFFFF,
  • màu đen #000000,
  • và màu xám #555555.


So sánh màu sắc trên các nền khác nhau cho văn bản thiết kế web


Như mong đợi, không giống nhau chút nào. ( Xem và tải xuống tệp .PSD tại đây. )

Làm thế nào chúng ta có thể làm cho nó trông giống nhau trên cả ba? Rõ ràng, văn bản trên nền trắng cần phải có màu vàng đậm hơn và văn bản trên màu xám cần điều chỉnh sắc độ / tông màu. (Văn bản xung quanh cũng sẽ ảnh hưởng đến nó - nhưng điều đó dường như khó giải thích hơn.)

Màu sắc hoàn hảo này bằng cách nào đó có thể được tính toán, dựa trên Hex, RGB hoặc hệ thống khác? Đó là mấu chốt của câu hỏi này, vì nó sẽ hiệu quả hơn nhiều so với xấp xỉ thủ công.


Bạn sẽ cần sử dụng màu vàng. Lưu ý trong các ví dụ của bạn, họ đã sử dụng các màu tương tự như màu mà họ đang cố gắng để làm cho trông khác biệt.
Hanna

2
@Johannes, ý bạn là gì?
Baumr

Trong ví dụ đầu tiên của bạn, màu sắc được sử dụng là tất cả các màu xám. Trong ví dụ thứ hai của bạn, màu tím của bạn được tạo ra để trông có màu xanh hơn thông qua việc sử dụng màu tím rất sáng. Sau đó, trong ví dụ màu vàng của bạn, bạn đang nhuộm màu vàng của lòng trắng, màu xám và màu đen. Vì vậy, những gì tôi đang nói là bạn cần sử dụng màu vàng thay vào đó để làm cho màu vàng của bạn xuất hiện giống nhau trên các nền khác nhau.
Hanna

Tôi đang có một thời gian khó khăn để giải thích điều này, tôi xin lỗi.
Hanna

Câu trả lời:


10

Có vẻ như bạn đang tìm kiếm sự tương tự của các màu bổ sung , nhưng trong không gian nhẹ nhàng hơn là màu sắc . Theo tôi có thể nói, không có bản đồ chung như vậy có thể tồn tại.

Giả sử bạn có thể bù hiệu ứng bằng cách giả sử một mối tương quan tuyến tính giữa nền và nền trước, để nền sau làm tối văn bản nền trước sáng lên cùng một lượng. Tôi cho rằng màu sắc vẫn cố định. Sẽ luôn có một điểm giữa mà nền và tiền cảnh chia sẻ cùng một màu.

Ví dụ, xem xét màu đen trên màu trắng. Độ sáng đối nghịch cho cùng một màu là màu trắng trên nền đen, nhưng nếu bạn cố gắng tìm tiền cảnh cho mọi nền trung gian của cùng một màu, tại điểm giữa, bạn nhấn màu xám trên xám và không thể thấy gì cả.

Vì nhiều lý do tương tự, tôi không thể thấy rằng bất kỳ ánh xạ hợp lý đơn giản nào - thậm chí là một bản đồ bị mất - có thể tồn tại.


1
Để giải quyết điều này, tôi nghĩ rằng chúng ta sẽ cần xây dựng một mô hình mắt người (trung bình) và tìm ra sự phù hợp nhất bằng thuật toán di truyền
Baumr

1
@Baumr: Có thể là một luận án tiến sĩ tốt :)
Cuộc đua nhẹ nhàng với Monica
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.