§ 02
Colour contrast (WCAG)
Opfylder min tekstfarve på denne baggrund WCAG's krav til kontrast?
Answer: WCAG kræver et minimums-kontrastforhold mellem tekst og baggrund, så tekst kan læses af brugere med nedsat synsstyrke. Kontrastforholdet regnes ud fra begge farvers relative luminans (W3C's formel, som lineariserer sRGB-værdierne og vægter rød/grøn/blå forskelligt efter øjets følsomhed). Indtast begge farver som RGB (0-255) for at få det faktiske kontrastforhold. Værktøjet erstatter ikke en fuld tilgængeligheds-gennemgang, men giver et hurtigt tjek af netop dette ene kriterie.
Formula
relativ luminans L = 0,2126×R' + 0,7152×G' + 0,0722×B', hvor hver kanal først lineariseres: c' = c/12,92 hvis c ≤ 0,03928, ellers ((c+0,055)/1,055)^2,4 (c = kanalværdi/255)
kontrastforhold = (L_lys + 0,05) / (L_mørk + 0,05)
WCAG-krav: 4,5:1 (AA, normal tekst), 3:1 (AA, stor tekst), 7:1 (AAA, normal tekst)
| Symbol | Meaning | Unit |
|---|---|---|
| tr | Tekstfarve — rød (R) | 0-255 |
| tg | Tekstfarve — grøn (G) | 0-255 |
| tb | Tekstfarve — blå (B) | 0-255 |
| br | Baggrundsfarve — rød (R) | 0-255 |
| bg | Baggrundsfarve — grøn (G) | 0-255 |
| bb | Baggrundsfarve — blå (B) | 0-255 |
| = | Kontrastforhold | : 1 |
| = | Tekstfarvens relative luminans | |
| = | Baggrundsfarvens relative luminans |
Gyldighed og kilde
- Source
- WCAG 2.1, succeskriterium 1.4.3 og 1.4.6 (W3C)
Gælder ikke når
- Formlen er W3C's officielle definition, men den tager ikke højde for skrifttype, skriftvægt eller antialiasing. Brug altid et rigtigt tilgængeligheds-værktøj (fx browserens DevTools) som endeligt tjek før aflevering.
Worked example
Beregnerens egne standardværdier sat ind. Tallene er regnet med præcis den formel værktøjet bruger.
Sat ind
- Tekstfarve — rød (R)30 0-255
- Tekstfarve — grøn (G)30 0-255
- Tekstfarve — blå (B)30 0-255
- Baggrundsfarve — rød (R)255 0-255
- Baggrundsfarve — grøn (G)255 0-255
- Baggrundsfarve — blå (B)255 0-255
Giver
- Kontrastforhold16.67 : 1
- Tekstfarvens relative luminans0.013
- Baggrundsfarvens relative luminans1.000
Members only
The calculator itself is locked
Create a free user account to unlock all articles, calculators, templates and range — and get access to quizzes and classes. It takes less than a minute: name, email and a password. No payment card.
Want to try something first? See what you can use without an account — the junior zone, the encyclopedia, the videos and more.