Berechnen Sie das Kontrastverhältnis von Text und Hintergrund nach WCAG 2.2 — AA/AAA-Vorschau, relative Luminanz und exportierbarer Bericht ohne Server-Upload.
Volade Tools
15.99:1
Kontrastverhältnis
Stufe AA
Bestanden
Stufe AAA
Bestanden
Validieren Sie AA und AAA, relative Luminanz und Konformität — ohne Markenfarben an Drittserver zu senden.
UI-Designer, Front-end-Entwickler, Produktteams und Auditoren prüfen Text/Hintergrund-Kontrast dutzende Male pro Sprint — Primärbuttons, Links, Fehler-Badges, Hell- und Dunkel-Themen. Volade berechnet WCAG-2.2-Verhältnis in Echtzeit im Browser: sRGB-relative Luminanz, AA-Schwellen (4,5:1 / 3:1) und AAA (7:1 / 4,5:1), Typografie-Vorschau, Farbtausch und kopierbarer Bericht — ohne Upload zu WebAIM, Adobe Color oder unbekannten Diensten.
Weil zu viele Online-Prüfer Sitzungen nicht dokumentieren und Paletten teils serverseitig verarbeiten. Weil Teams WCAG 2.2, Live-Vorschau und sicheren Verlauf brauchten — ohne vollständige Charten preiszugeben.
«Ich validiere jeden Farb-Token vor dem Merge — lokale Berechnung, kein WebAIM-Upload. V+-Verlauf dokumentiert Hell/Dunkel ohne Screenshots.»
Camille D.
Design Lead Barrierefreiheit
«AA/AAA neu berechnet beim Umschalten normal/groß — keine Audit-Überraschungen mehr. V+-TXT direkt an Compliance-Tickets.»
Yann P.
Front-end-Integrator
«Leerer Network-Tab bei jeder Kundendemo — genau das verlangt unsere Datenschutzbeauftragte. Farbtausch unverzichtbar für Dark Mode.»
Nadia K.
Barrierefreiheits-Beraterin
Niedrigkontrast-Text schließt Menschen mit Sehschwäche oder Farbenblindheit aus. WCAG 2.2 Success Criteria 1.4.3 verlangt 4,5:1 für normalen Text — übernommen in BITV, EN 301 549 und RGAA.
Volade beschleunigt Validierung: Hex eingeben oder wählen, normal/groß umschalten, Verhältnis und AA/AAA lesen, für Dark Mode tauschen, Bericht kopieren oder exportieren. Gast: unbegrenzt mit Wasserzeichen. Angemeldet: Verlauf 10. V+: 100 Einträge und TXT ohne Wasserzeichen.
Vier Schritte vom « sieht lesbar aus » zur chiffrierten Validierung für BITV-Audit oder Design-System-Review.
In 4 Schritten
Vordergrund und Hintergrund wählen
Farbauswahl oder #RRGGBB für Text und Hintergrund — Figma-Tokens, CSS-Variablen oder PDF-Charte.
Textgröße wählen
Normal vs. groß je nach Komponente — AA/AAA-Schwellen aktualisieren sich sofort.
Verhältnis und Urteile lesen
Verhältnis (z. B. 5,2:1) und AA/AAA-Badges prüfen. Tausch für Dark- oder Hover-Varianten.
Kopieren oder exportieren
Strukturierten Bericht kopieren (dezentes Gast-Wasserzeichen). V+: TXT ohne Wasserzeichen und erweiterter Verlauf.
Designer, Front-end-Entwickler, Barrierefreiheitsteams und Auditoren prüfen täglich Kontrast — hier passt Volade natürlich hinein.
Jedes --color-text / --color-bg-Paar vor Storybook- oder Figma-Publikation validieren — V+-Verlauf für Hell/Dunkel-Sitzungen.
Jedes getestete Text/Hintergrund-Verhältnis objektiv dokumentieren — V+-TXT an Nachweisordner anhängen.
Farben mit einem Klick tauschen, um Dark Mode gegen gleiche AA-Schwellen wie Light Mode zu prüfen.
Geänderte Hex in CSS-PR schnell testen — Bericht in GitHub-Kommentar ohne unscharfe Screenshots.
Wir verglichen Volade mit WebAIM Contrast Checker, Contrast Ratio, Color Review, Adobe Color und Accessible Colors bei Datenschutz, Typografie-Vorschau, Verlauf und Exporten.
Volade führt bei 100 % Client-Berechnung, dual normal/groß, schnellem Tausch, Metadaten-Verlauf (10/100) und V+-TXT ohne Wasserzeichen. Konkurrenten für Einzelklicks; Volade für wiederholte Design/Barrierefreiheit-Zyklen.
Lokale WCAG-Berechnung + Live-Vorschau + Tausch + sicherer Verlauf. Für Teams mit vertraulichen Paletten vor Produktstart.
| Kriterium | Volade | WebAIM | Contrast Ratio | Color Review | Adobe Color | Accessible Colors |
|---|---|---|---|---|---|---|
| 100 % clientseitig | Ja | Teilweise | Ja | Teilweise | Nein | Teilweise |
| WCAG-2.2-Luminanzverhältnis | Ja | Ja | Ja | Ja | Ja | Ja |
| AA + AAA normal / groß | Ja | Ja | Teilweise | Ja | Teilweise | Ja |
| Live-Typografie-Vorschau | Ja | Teilweise | Nein | Ja | Ja | Teilweise |
| Vordergrund / Hintergrund tauschen | Ja | Nein | Nein | Teilweise | Nein | Nein |
| Verlauf 10 / 100 | Ja | Nein | Nein | Nein | Nein | Nein |
| TXT-Export ohne Wasserzeichen | V+ | Nein | Nein | Nein | Nein | Nein |
Indikative Gegenüberstellung — Juli 2026. „Teilweise“ = eingeschränktes Feature, Konto nötig oder Server-Verarbeitung.
Wählen Sie Volade, wenn Sie sensible Markenfarben validieren, ohne sie an unbekannte Server zu senden — mit lokalem Verlauf und V+-exportierbaren Berichten.
Verhältnisberechnung, AA/AAA-Urteile, Vorschau und Tausch sind gratis. V+ Premium entfernt Kopier-Wasserzeichen, erweitert Verlauf auf 100 Paare und schaltet lokalen TXT-Export frei.
| Funktion | Gratis | V+ Premium |
|---|---|---|
| WCAG-2.2-Verhältnis (relative Luminanz) | ||
| AA- & AAA-Urteile (normal / groß) | ||
| Farbauswahl + Hex-Eingabe | ||
| Live-Typografie-Vorschau | ||
| Vordergrund / Hintergrund tauschen | ||
| Bericht kopieren (Gast-Wasserzeichen) | Ohne Wasserzeichen | |
| TXT-Bericht exportieren | — | |
| Paar-Verlauf (Hex, Verhältnis, Größe) | 10 | 100 |
| 100 % lokale Verarbeitung |
Verhältnisberechnung, AA/AAA-Vorschau und Farbtausch bleiben gratis. V+ Premium entfernt das Kopier-Wasserzeichen, erweitert den Verlauf auf 100 Paare und schaltet TXT-Barrierefreiheitsbericht frei.
Ihre Hex-Codes verlassen nie den Browser: keine Server-Requests zum Berechnen, Tauschen oder Exportieren. Verlauf speichert Hex, Verhältnis, Größe und Zeitstempel in localStorage — prüfbar in DevTools → Network und Application.
Guter Kontrast schützt Millionen sehbehinderter Nutzer — diese Gewohnheiten vermeiden teure Rollbacks nach Audits.
Dokumentieren Sie validierte Paare im Design System — Volade V+ exportiert einen TXT-Bericht für interne Audit-Lieferungen.
Datenschutz, Luminanzformel, AA vs. AAA, normal/großer Text, BITV, Dark Mode, V+-TXT-Export, Verlauf und Vergleich WebAIM, Contrast Ratio, Color Review, Adobe Color, Accessible Colors — zehn ausführliche Antworten.
Nein. Das Kontrastverhältnis wird vollständig in JavaScript in Ihrem Browser aus Hex-Werten berechnet. Die Formel folgt der WCAG-relativen Luminanz (linearisiertes sRGB) — keine Netzwerkanfrage bei Berechnung, Tausch oder Berichtskopie.
Prüfen Sie in DevTools (F12), Network-Tab: testen Sie vertrauliche Markenfarben. Null POST-Aufrufe oder Uploads — Ihre Paletten bleiben auf Ihrem Gerät, auch offline nach dem Laden.
TXT ohne Wasserzeichen, 100-Paar-Verlauf und Hell/Dunkel-Tausch-Workflow — in allen Volade-Tools.
Testversion je nach Tarif. Jederzeit kündbar.
Stand: Juli 2026. Referenzen: WCAG 2.2 (Success Criteria 1.4.3, 1.4.6), RGAA 4.1, EN 301 549.