• Kontrasttjek til webtilgængelighed

Kan alle læse din tekst? .. også dem med dårligt syn eller når der er sollys på skærmen?
Vælg to farver herunder, så får du svaret med det samme
⬇ Gå direkte til værktøjet ⬇

Så nemt er det:

1. Vælg din tekstfarve og din baggrundsfarve.
Skriv en hex-kode som #001330, eller klik på cirklen.
2. Se kontrasten og de fem tjek.
Grøn er bestået, rød er ikke.
3. Klarer teksten ikke kravet, foreslår værktøjet en farve, der gør.
Ét klik, så er den sat ind.

Værktøjet er gratis, kræver ikke login og gemmer ikke de farver, du skriver.

TIP: Almindelig tekst skal mindst være 4,5:1.

 

Brug værktøjet

Vælg dine farver og scor godt ift. WCAG-retningslinjerne

Stor overskrift
Almindelig brødtekst. Sådan ser en helt almindelig tekst ud i de farver, du har valgt.
Knap eller ikon
–Kontrast
  • Almindelig tekst – AA Kræver mindst 4,5:1
  • Stor tekst – AA Kræver mindst 3:1
  • Knapper, ikoner og felter Kræver mindst 3:1
  • Almindelig tekst – AAA Kræver mindst 7:1
  • Stor tekst – AAA Kræver mindst 4,5:1

Hvad kræver WCAG af kontrasten?

WCAG er de internationale retningslinjer for tilgængelige hjemmesider. De måler kontrast som et forhold – fra 1:1, hvor tekst og baggrund er samme farve, til 21:1, som er sort på hvid.

Det niveau, kravene peger på, hedder AA. Her er grænserne:

Hvad Mindst Niveau
Almindelig tekst 4,5:1 AA
Stor tekst 3:1 AA
Knapper, ikoner og kanter på felter  3:1 AA
Almindelig tekst, strengeste niveau 7:1 AAA

 

AAA er ikke et krav. Men det er et godt mål, hvis folk skal læse lange tekster hos dig.

Hvad er stor tekst?

Stor tekst er mindst 24 pixels – eller mindst 18,66 pixels, hvis den er fed. Det svarer til 18 og 14 punkt.

Så en stor overskrift kan godt klare sig med lidt mindre kontrast end brødteksten. Brødteksten kan ikke.

Webtilgængelighed og EN 301 549

EN 301 549 er den europæiske standard for tilgængelighed. Den opfinder ikke sine egne regler for hjemmesider. Den henviser til WCAG.

Den danske webtilgængelighedslov gælder for offentlige myndigheder. Ifølge Digitaliseringsstyrelsen kræver den, at man følger EN 301 549 version 3.2.1, som bygger på WCAG 2.1. En nyere version, der bygger på WCAG 2.2, er på vej. Grænserne for kontrast er de samme i begge versioner.

Siden juni 2025 er en del private virksomheder også omfattet af tilgængelighedskrav. Det gælder blandt andet webshops, der sælger til forbrugere – men ikke alle, og der er undtagelser for de helt små virksomheder. Er du i tvivl, om du er omfattet, så spørg en jurist. Det er ikke en af de ting, man skal gætte sig til.

Og husk: Kontrast er kun ét af mange krav. Består dine farver, er du godt på vej. Men du er ikke i mål.

Vi tjekkede vores egne farver

Vi gik vores eget farveskæma efter i sømmene. Det gik ikke helt glat.

Farver Kontrast Resultat
Blå #0065FC på hvid 4,92:1 Består AA til almindelig tekst
Mørkeblå #001330 på grøn #A6CE80 10,35:1 Består alt, også AAA
Koral #F27663 på hvid 2,78:1  Består ikke engang kravet til store overskrifter

 

Vores koral er en dejlig farve. Men den hører til i baggrunden og i grafik – ikke i teksten. Værktøjet foreslog i stedet #B95A4B, som giver 4,53:1. Den minder stadig om koralen, men nu kan alle læse den.

Sådan får du bedre kontrast

  • Gør teksten mørkere – ikke baggrunden lysere.
    Det er som regel den mindste ændring, der skal til. Prøv knappen "Brug den" i værktøjet.
  • Pas på med lys grå tekst.
    Den ser elegant ud på designerens skærm. På en mobil i solskin forsvinder den.'
  • Tjek hjælpetekst i felter.
    Den grå tekst, der står i et tomt felt, er en klassisk synder.
  • Tekst på billeder:
    Tjek mod den lyseste del af billedet. Eller læg et mørkt lag under teksten.
  • Brug ikke kun farve til at fortælle noget.
    En rød fejlbesked skal også have en tekst eller et ikon. Ellers kan farveblinde ikke se forskel.

Ofte stillede spørgsmål om kontrast

Hvad er et godt kontrastforhold?

Mindst 4,5:1 til almindelig tekst og 3:1 til store overskrifter, knapper og ikoner. Vil du være på den sikre side med lange tekster, så sigt efter 7:1.

Hvad er EN 301 549?

Den europæiske standard for tilgængelighed i digitale produkter og tjenester. For hjemmesider henviser den til WCAG – også når det gælder kontrast.

Er jeg omfattet af kravene om webtilgængelighed?

Offentlige myndigheder er. En del private virksomheder er også, blandt andet webshops, der sælger til forbrugere. Der er undtagelser, så tjek dine forhold med en jurist, hvis du er i tvivl.

Betyder bestået kontrast, at min hjemmeside er tilgængelig?

Nej. Kontrast er ét krav blandt mange. Billeder skal have alternativ tekst, siden skal kunne bruges uden mus, formularer skal være til at forstå – og sådan fortsætter listen.

Gælder kravene også for logoer?

Nej. Tekst i logoer og navne på brands er undtaget. Det samme gælder knapper, der ikke kan klikkes på, og ren pynt.

Hvorfor viser et andet værktøj 0,01 højere?

Nogle værktøjer runder op. Vi runder ned, så 4,499 aldrig ser ud som 4,50. Om farven består, regner vi altid ud fra det præcise tal.