Indtast HEX-farver eller vælg Pantone-farver til forgrund og baggrund.
Gennemgå kontrastforholdet og WCAG AA- eller AAA-resultater for normal tekst, stor tekst og UI-komponenter.
Brug live preview, byt farver, kopiér CSS, eller prøv tilgængelige Pantone-forslag.

Anvendelser for kontrasttjek

Validér brandfarvepar, før de bruges i digitale layouts.
Tjek knapper, formularer, navigation og andre UI-komponenter for læsbar kontrast.
Sammenlign Pantone-inspirerede paletter, før trykfarver tilpasses skærme.
Dokumentér WCAG-resultater til tilgængelighedsreview og designhandoff.

Farvekontrasttjek til WCAG-, UI- og Pantone-workflows

Brug dette kontrasttjek, når du skal bekræfte, at tekstfarve, baggrund, knaptilstand eller brandpalette er læsbar, før den bruges på et website, i en app, præsentation eller et designsystem.

Læs WCAG-kontrastresultatet korrekt

Værktøjet beregner den relative luminans for begge farver og viser kontrastforholdet, som WCAG bruger. Normal brødtekst kræver typisk 4.5:1 for AA og 7:1 for AAA, mens stor tekst og vigtige UI-komponenter har lavere grænser.

Forbind Pantone-farver og digital tilgængelighed

Pantone-farver vælges ofte til brand og tryk, men deres skærmversioner skal stadig tjekkes for tilgængelighed. Søg efter Pantone-navne eller HEX-værdier, se parret i preview, og sammenlign tilgængelige alternativer, før farver overdrages til design eller udvikling.

Et praktisk workflow for designere og udviklere

Start med de præcise HEX-værdier fra designfilen, test både forgrund og baggrund i begge retninger, kopiér CSS eller rapport, og gem det beståede farvepar sammen med dokumentationen for Pantone-paletten.

Ofte stillede spørgsmål om kontrasttjek

Hvad måler dette kontrasttjek?

Det måler luminanskontrastforholdet mellem en forgrundsfarve og en baggrundsfarve og sammenligner resultatet med WCAG-grænserne.

Hvad er kravene til WCAG AA- og AAA-kontrast?

WCAG AA kræver mindst 4.5:1 for normal tekst og 3:1 for stor tekst eller UI-komponenter. WCAG AAA kræver 7:1 for normal tekst og 4.5:1 for stor tekst.

Kan Pantone-farver tjekkes for webtilgængelighed?

Ja. Pantone-referencer kan konverteres til skærmfarveværdier og derefter kontrolleres for digital kontrast. Verificér altid de endelige farver i det medie, hvor de vises.

Bemærkning om kontrast

Resultaterne beregnes ud fra digitale farveværdier og er beregnet til tilgængelighedsplanlægning. Fysisk tryk, materialer, lys og skærmkalibrering kan ændre den oplevede kontrast.