Kontrast kolorów

Tworzene strony WWW, loga lub reklamy powinny wywoływać emocje, można do tego wykorzystać sposób w jakim ludzie widzą kolory, jak na nich oddziałowywwują. Kontrast to łączenie 2 kolorów różniących się od siebię, a więc to zestaw niepokojący i przez to zwracający uwagę. Rózni się on od zestawu kolorów zblizonych do siebie, stonowanych które uspokajają i powodują spadek uwagi. Za pomocą kilku kontrastowych kolorów barw możemy stymulować uwagę odbiorcy. Najsilniejszy kontrast barwny uzyskujemy zestawiając ze sobą kolory ciepłe i zimne niebieski – pomarańczowy, czerwony – zielony. Efekt kontrastu uzyskamy również, gdy z czystymi barwami połączymy kolory niechromatyczne takie jak (biały, szary, czarny), ale nigdy nie da to takiego silnego kontrastu jak kontrast barw chromatycznych. Kolory gdy znajdą się w otoczeniu innych barw kontrastowych zmieniają się w odbiorze. I tak kolor czerwony na chłodnym tle wyda się bardziej ekspresyjny (żarzący). Należy jednak pamiętać, że kolory kontrastowe są męczące dla wzroku i nadmierne użycie kontrastu barwnego może okazać się niekorzystne.

Tabela pokazująca wartość procentową kontrastu dla podstawowych kolorów.
Są tu 2 tabele z tymi samymi kolorami, bo kolorowe i kontrastowe zwraca uwagę, ale nie jest to równoznaczne, że jest to rozwiązanie najczytelniejsze.

  beżowy biały szary czarny brązowy różowy fiolet zielony pomarańcz niebieski żółty czerwony
czerwony 78 84 32 38 7 57 28 24 62 13 82 0
żółty 14 16 73 89 80 58 75 76 52 79 0  
niebieski 75 82 21 47 7 50 17 12 56 0    
pomarańcz 44 60 44 76 59 12 47 50 0      
zielony 72 80 11 53 18 43 6 0        
fiolet 70 79 5 56 22 40 0          
różowy 51 65 37 73 53 0            
brązowy 77 84 26 43 0              
czarny 87 91 58 0                
szary 69 78 0                  
biały 28 0                    
beżowy 0                      


  beżowy biały szary czarny brązowy różowy fiolet zielony pomarańcz niebieski żółty czerwony
czerwony 78 84 32 38 7 57 28 24 62 13 82 0
żółty 14 16 73 89 80 58 75 76 52 79 0  
niebieski 75 82 21 47 7 50 17 12 56 0    
pomarańcz 44 60 44 76 59 12 47 50 0      
zielony 72 80 11 53 18 43 6 0        
fiolet 70 79 5 56 22 40 0          
różowy 51 65 37 73 53 0            
brązowy 77 84 26 43 0              
czarny 87 91 58 0                
szary 69 78 0                  
biały 28 0                    
beżowy 0                      

Przykłady zastosowania kontrastu barw w projektach stron WWW

barwy kontrastowe 01
rgb (237, 115, 45)
rgb (190, 209, 102)
rgb (237, 234, 228)



barwy kontrastowe 02
rgb(240, 188, 17)
rgb(206, 114, 232)
rgb(178, 84, 204)
rgb(245, 245, 245)



barwy kontrastowe 03
rgb(57, 67, 69)
rgb(245, 98, 162)
rgb(245, 208, 22)
rgb(240, 64, 48)
rgb(152, 163, 163)



barwy kontrastowe 04
rgb(250, 250, 250)
rgb(235, 28, 38)
rgb(21, 110, 8)
rgb(0, 0, 0)



Narzędzie do dobierania kolorów online

Narzędzie do grafiki online