WCAG-Farbkontrastverhältnis-Rechner
Messen Sie das WCAG-Kontrastverhältnis zwischen einer Vordergrund- und einer Hintergrundfarbe, um sicherzustellen, dass Ihr Text lesbar und barrierefrei ist.
Higher is more readable (max 21:1)
- 1
Fg relative luminance
0.2126×0,0103 + 0.7152×0,0103 + 0.0722×0,0103 = 0,0103Each sRGB channel is gamma-linearised (transfer function) then weighted per WCAG - 2
Bg relative luminance
0.2126×1 + 0.7152×1 + 0.0722×1 = 1 - 3
Contrast ratio
(1 + 0.05) ÷ (0,0103 + 0.05) = 17,40
Wie funktioniert dieser Rechner?
Das WCAG-Kontrastverhältnis ist (hellere Leuchtdichte + 0,05) / (dunklere Leuchtdichte + 0,05) und reicht von 1:1 bis 21:1. Streben Sie mindestens 4,5:1 für normalen Text und 3:1 für großen Text an, um AA zu erfüllen, oder 7:1 und 4,5:1 für AAA. Geben Sie zwei Hex-Farben ein, um sofort zu prüfen.
Formel
How this is calculated
Geben Sie eine Vordergrundfarbe (Text) als Hex-Wert und eine Hintergrundfarbe als Hex-Wert ein. Sowohl die 3-stellige Kurzform (#fff) als auch die 6-stellige Form (#ffffff) werden akzeptiert, mit oder ohne führendes "#".
Jede Farbe wird in ihre relative Leuchtdichte umgerechnet. Der 8-Bit-Kanalwert wird durch 255 geteilt und dann linearisiert: Ist das Ergebnis s kleiner oder gleich 0,03928, wird es durch 12,92 geteilt, andernfalls wird es zu ((s + 0,055) / 1,055) hoch 2,4. Die linearisierten Rot-, Grün- und Blauwerte werden mit 0,2126, 0,7152 bzw. 0,0722 gewichtet und summiert, um die Leuchtdichte L zu ergeben. Das Kontrastverhältnis ist (Llighter + 0,05) / (Ldarker + 0,05), wobei der Term 0,05 das Umgebungslicht modelliert. Die Verhältnisse reichen von 1:1 (identische Farben) bis 21:1 (reines Schwarz auf reinem Weiß).
Die WCAG-2.1-Schwellenwerte bestimmen die Bestehensergebnisse: AA erfordert mindestens 4,5:1 für normalen Text und 3:1 für großen Text (etwa 18 pt oder 14 pt fett); AAA erfordert 7:1 für normalen Text und 4,5:1 für großen Text. Die Berechnung ist symmetrisch, sodass das Vertauschen von Vordergrund und Hintergrund dasselbe Verhältnis ergibt. Sie bewertet nur die Farbe und berücksichtigt keine Deckkraft, kein Anti-Aliasing und keine überlappenden Ebenen.
Häufige Fragen
Mindestens 4,5:1 für normalen Fließtext und 3:1 für großen Text (etwa 18 pt regulär oder 14 pt fett). Für die strengere Stufe AAA benötigen Sie 7:1 bei normalem und 4,5:1 bei großem Text.
Nein. Die Formel verwendet die hellere und dunklere Leuchtdichte unabhängig davon, welche Farbe Sie als Vordergrund bezeichnen, sodass das Vertauschen der beiden Eingaben dasselbe Verhältnis ergibt.
Reines Weiß hat eine relative Leuchtdichte von 1 und reines Schwarz von 0. Setzt man diese in (1 + 0,05) / (0 + 0,05) ein, ergibt sich genau 21, der höchste erreichbare Kontrast.
Auch bekannt als
TG we-Calculate Editorial Team. (2026). WCAG-Farbkontrastverhältnis-Rechner [Online calculator]. TG we-Calculate. https://we-calculate.com/de/calculator/color-contrast-ratio-calculator
TG we-Calculate Editorial Team. "WCAG-Farbkontrastverhältnis-Rechner." TG we-Calculate. 2026. https://we-calculate.com/de/calculator/color-contrast-ratio-calculator.
TG we-Calculate Editorial Team, "WCAG-Farbkontrastverhältnis-Rechner," TG we-Calculate, 2026. [Online]. Available: https://we-calculate.com/de/calculator/color-contrast-ratio-calculator
@misc{wecalculate_color_contrast_ratio_calculator, title = {WCAG-Farbkontrastverhältnis-Rechner}, author = {{TG we-Calculate Editorial Team}}, howpublished = {\url{https://we-calculate.com/de/calculator/color-contrast-ratio-calculator}}, year = {2026}, note = {TG we-Calculate} }
Hat Ihnen dieser Rechner geholfen?