Forced Colors Mode
Erzwingungsmodus für Farben
Der Farbmodus erzwingen verwendet eine vom Benutzer gewählte Systempalette anstelle vieler Seitenfarben. Dies kann Steuerelemente und Text leichter unterscheidbar machen.
@media (forced-colors: active) -> system colors + visible shape and statebackground + box-shadowButtonText · ButtonFace · borderoutline: 2px@media (forced-colors: active) -> system colors + visible shape and stateA11YEin weiteres Beispiel
Ein Button verliert seinen Autor-Hintergrund und Schatten. Sein Rand, Text und Fokusanzeige zeigen weiterhin seine Form und seinen Zustand.
Hauptteile
- 01Autorenpalette
- 02vom Benutzer erzwungene Farbpalette
- 03Sichtbare Grenze
- 04Systemfarbe
- 05Fokusanzeige
- 06Farbangleich-Ausnahme
Verwenden Sie es, wenn
Testen Sie Steuerelemente mit aktivierten Erzwingungsfarben. Halten Sie wichtige Grenzen sichtbar und verwenden Sie Systemfarben für notwendige Anpassungen.
Nutze es nicht, wenn
Verlassen Sie sich nicht ausschließlich auf Farbe oder Box-Schatten. Verwenden Sie forced-color-adjust none nur, wenn die Farbtreue wesentlich ist.
In Code verwendeter Name
@media (forced-colors: active) -> system colors + visible shape and state Vor dem Ausliefern
Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states.
Outcome: Complete the task with Erzwingungsmodus für Farben (Forced Colors Mode). User context: Ein Button verliert seinen Autor-Hintergrund und Schatten. Sein Rand, Text und Fokusanzeige zeigen weiterhin seine Form und seinen Zustand. Recommended pattern: Erzwingungsmodus für Farben (Forced Colors Mode). Why it fits: Testen Sie Steuerelemente mit aktivierten Erzwingungsfarben. Halten Sie wichtige Grenzen sichtbar und verwenden Sie Systemfarben für notwendige Anpassungen. Do not use it when: Verlassen Sie sich nicht ausschließlich auf Farbe oder Box-Schatten. Verwenden Sie forced-color-adjust none nur, wenn die Farbtreue wesentlich ist. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): Ein formelles Dokument kann trotzdem ein Entwurf, ein Release Candidate oder die finale Version sein. Prüfe seinen Status und die Browser- oder Plattform-Unterstützung. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Diese Anfrage prüfen
Review how Erzwingungsmodus für Farben (Forced Colors Mode) is used now. Definition: Der Farbmodus erzwingen verwendet eine vom Benutzer gewählte Systempalette anstelle vieler Seitenfarben. Dies kann Steuerelemente und Text leichter unterscheidbar machen. Release checks: Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.