Sjekken bruker den offisielle WCAG-formelen for relativ luminans, så tallene stemmer med WebAIM-sjekker og de fleste tilgjengelighetsstandarder. Alt kjører i nettleseren - fargene dine lastes aldri opp, og det er ingen grenser.
WCAG kontrast sjekker
Kjører helt i nettleseren - ingen opplasting, ingen registrering.
Kontrastforhold
Beståttkrever 4.5:1
Beståttkrever 3:1
Ikke beståttkrever 7:1
Beståttkrever 4.5:1
Stor = 18pt (24px), eller 14pt (18,66px) halvfet.
Hva er en fargekontrast sjekker?
En fargekontrast sjekker måler kontrastforholdet mellom en tekstfarge og bakgrunnen og forteller deg om det oppfyller WCAG-kravene til tilgjengelighet. Verktøyet returnerer et forholdstall fra 1:1 til 21:1 og viser bestått eller ikke bestått for AA og AAA på både vanlig og stor tekststørrelse.
Slik bruker du verktøyet
- 1Skriv inn fargene. Skriv en hex-kode, rgb()-verdi eller CSS-fargenavn for tekst og bakgrunn, eller velg med fargevelgeren.
- 2Les av forholdstallet. Kontrastforholdet oppdateres direkte, med en forhåndsvisning av teksten på bakgrunnen din.
- 3Se resultatet. Hvert merke viser bestått eller ikke bestått for WCAG AA og AAA på vanlig og stor tekststørrelse.
Hvem passer det for
- Designere som tester merkefargene før de når utvikling.
- Front-end-utviklere som sjekker knapp-, lenke- og etikett-farger mot WCAG AA.
- Tilgjengelighetsrevisorer som dokumenterer kontrastfeil med nøyaktige forholdstall.
- Innholds- og e-postteam som bekrefter at teksten forblir leselig på fargede bakgrunner.
Vanlige spørsmål
Er kontrastsjekken gratis?
Ja - den er 100 % gratis uten registrering og ingen grenser. Den kjører helt i nettleseren din.
Hvilket kontrastforhold krever WCAG AA?
WCAG 2.1 nivå AA krever et kontrastforhold på minst 4,5:1 for vanlig tekst og 3:1 for stor tekst. Nivå AAA hever dette til 7:1 for vanlig tekst og 4,5:1 for stor tekst.
Hva regnes som stor tekst?
Stor tekst er minst 18pt (ca. 24px) ved normal vekt, eller 14pt (ca. 18,66px) i halvfet. Stor tekst tillates et lavere kontrastforhold fordi større bokstaver er lettere å lese.
Hvordan beregnes kontrastforholdet?
Det er (L1 + 0,05) / (L2 + 0,05), der L1 og L2 er relativ luminans for den lysere og mørkere fargen. Luminansen beregnes fra sRGB-kanalene for rødt, grønt og blått etter WCAG 2.x-definisjonen.
Støtter den hex, RGB og fargenavn?
Ja. Du kan skrive inn 3-, 4-, 6- eller 8-sifrede hex-koder, rgb()- og rgba()-verdier, eller et CSS-fargenavn som «teal». Du kan også velge farger med den innebygde fargeknappen.
Hvorfor gir samme forholdstall noen ganger bestått og andre ganger ikke bestått?
Kravet avhenger av tekststørrelse og nivået du sikter mot. Et forhold på 3,5:1 er ikke bestått for AA på vanlig tekst, men bestått for AA på stor tekst - sjekk alltid mot størrelsen og nivået du faktisk bruker.