Eine lesbare Farbpalette mit gemessenem Kontrast entwickeln.
Geben Sie Farben Funktionen und testen Sie echte Vordergrund-Hintergrund-Paare. Eine schöne Sammlung garantiert weder lesbaren Text noch zugängliche Interaktionszustände.
Passe den Ablauf an deine Aufgabe an.
Wählen Sie Farben für Rollen mit genauen Werten und testen Sie vorgesehene Vordergrund-Hintergrund-Paare. Prüfen Sie Interaktionszustände und andere Flächen. Trennen Sie Geschmack vom gemessenen Kontrast und testen Sie reale Komponenten.
- Was du bereitstellst
- Markenmerkmale und Barrierefreiheitsanforderungen.
- Was du erhältst
- Palettenvorschläge mit geprüften Kontrastwerten.
Sieh dir Eingabe und Ergebnis an.
Beispielhafte Ein- und Ausgabe · ein Lehrbeispiel, kein tatsächlicher WebAct-Durchlauf
Beispiel Eingabe
Create a small UI palette using navy and warm cream, plus an orange-brown accent. Need body text, links and a filled action button. Calculate contrast for solid, opaque pairs.
Vollständiges Beispiel
Background: #fff7ed Body text: #172554 — contrast on background ≈ 13.84:1 Underlined links/accent text: #9a3412 — contrast on background ≈ 6.88:1 Action button: #9a3412 background, #ffffff label — contrast ≈ 7.31:1 These pairs exceed the 4.5:1 normal-text threshold. This checks the stated solid-color pairs only; focus, hover, disabled states and the rest of the interface still need review.
Lade diese Eingabe in den Prompt und kopiere ihn zum Ausprobieren nach WebAct. Dein Ergebnis kann vom Beispiel abweichen.
Entscheidungen und Fehlerbehebung.
Garantiert ein kontrastreiches Textpaar die Zugänglichkeit des ganzen Interfaces?
Nein. Andere Zustände, Bedienelemente und Hinweise ohne Farbe brauchen Prüfung. Paarmessung ist nur ein Teil.
Warum taugt eine Akzentfarbe als Dekor, aber nicht für kleinen Text?
Der Text-Hintergrund-Kontrast ist vielleicht zu gering. Weisen Sie eine andere Rolle zu oder ändern Sie das Paar.
Quelle für diesen Arbeitsablauf.
Probiere es mit deiner eigenen Quelle.
Ersetze das Beispiel im Aufgaben-Prompt durch dein Material. Behalte nötige Anforderungen bei und kopiere die Aufgabe nach WebAct.
Aufgabe anpassen und kopieren ↑