Hopp til hovedinnhold

For lav fargekontrast

Tekst må ha god nok kontrast mot bakgrunnen for å være lesbar for svaksynte.

Oppdatert
Kategori: kontrast

Hva betyr dette?

WCAG-kravene krever et visst forhold mellom forgrunnsfarge (tekst) og bakgrunnsfarge. For normal tekst er kravet 4.5:1. For stor tekst (fet 14pt eller 18pt) er kravet 3:1.

Hvorfor er det viktig?

Svaksynte, fargeblinde og brukere i sterkt sollys sliter med å lese tekst som har lav kontrast (f.eks. lysegrå tekst på hvit bakgrunn).

Hvordan fikser jeg det?

Du må endre fargene i CSS-en din.

Eksempel

Hvis du har lysegrå tekst:

.text-muted {
  color: #999; /* For lav kontrast mot hvit (2.8:1) */
}

Endre den til en mørkere grå:

.text-muted {
  color: #595959; /* Godkjent (4.6:1) */
}

Du kan bruke verktøy som WebAIM Contrast Checker for å finne godkjente farger.