Kontrast boja je razlika u svjetlini između teksta i pozadine. Svijetlosivi tekst na bijelom izgleda elegantno na monitoru dizajnera, a na mobitelu na suncu postaje nečitljiv.
Koliko je dovoljno
WCAG smjernice traže omjer od najmanje 4.5:1 za običan tekst i 3:1 za velik tekst. Velik tekst znači od 24 piksela naviše, ili od 19 piksela ako je podebljan. Omjer ovisi o razlici u svjetlini, ne o tome koliko se boje razlikuju po nijansi: crvena i zelena iste svjetline daju slab kontrast.
Zašto je i zakonska tema
Od lipnja 2025. pristupačnost je obveza za mnoge web trgovine i usluge u EU, a kontrast je jedna od prvih stvari koje se provjeravaju. Loš kontrast istodobno smanjuje klikove na CTA gumbe.
Kako provjeriti
Par boja teksta i pozadine unesite u naš alat za provjeru kontrasta. Najčešći problemi su tekst preko fotografije bez tamnog sloja, sivi tekst u podnožju i bijeli tekst na žutim ili svijetlozelenim gumbima. Provjerite i stanja gumba pod pokazivačem miša, u kojima se kontrast često izgubi.
Povezani pojmovi
CSS
Cascading Style Sheets: jezik kojim se određuje izgled stranice. Boje, razmaci, veličine slova i raspored na mobitelu dolaze odavde, ne iz HTML-a.
Web pristupačnost
Prilagodba stranice korisnicima s invaliditetom — čitači ekrana, kontrast, navigacija tipkovnicom. Od lipnja 2025. i zakonska obveza po EU aktu EAA.
Tipografija
Izbor i raspored slova u dizajnu: fontovi, veličine, razmaci i hijerarhija naslova. Određuje koliko se tekst lako čita i koliko brend djeluje dosljedno.
Vizualni identitet
Skup vizualnih elemenata kojima se firma predstavlja — logo, boje, tipografija i fotografija. Osnovni sloj brenda i prvi dojam kod klijenta.
Favicon
Mala ikona stranice u kartici preglednika, u oznakama i uz Googleove rezultate pretrage. Mora ostati prepoznatljiva na samo 16 piksela.
CMYK
Model boja za tisak: cijan, magenta, žuta i crna tinta miješaju se na papiru. Zaslon koristi RGB, pa ista boja u tisku često ispadne tamnija i mutnija.