CSS-Farben

Das CSS-Farben Modul definiert Farben, Farbtypen, Farbmischung, Transparenz und wie Sie diese Farben und Effekte auf HTML-Inhalte anwenden können.

Während dieses Modul nur zwei CSS-Eigenschaften, color und opacity, umfasst, hängen über 20 CSS- und SVG-Eigenschaften, CSS-Bilder, @-Regeln und @media-Regeln von diesen zwei Eigenschaften ab.

Farben in Aktion

Der untenstehende Farbsyntax-Konverter zeigt die Werte der derzeit ausgewählten Farbe in den CSS-Farbformaten rot-grün-blau (RGB), hexadezimal (HEX), Farbton, Sättigung und Helligkeit (HSL) und Farbton, Weißheit und Schwarzheit (HWB). Alle hier gezeigten RGB-, HEX-, HSL- und HWB-Farbwerte repräsentieren denselben Farbwert, obwohl sie unterschiedlich geschrieben sind.

Die Auswahl einer Farbe über den Farbwähler und einer Transparenz über den Schieberegler aktualisiert die RGB-, HEX-, HSL- und HWB-Werte. Wenn Sie einen neuen Farb- oder Transparenzwert wählen, aktualisiert sich die Farbe des Hintergrunds und des Schiebereglers über die CSS-Eigenschaften background-color und accent-color, jeweils.

Um den Code für diesen Farbsyntax-Konverter zu sehen, sehen Sie sich den Quellcode auf GitHub an.

Referenz

Eigenschaften

At-Rules und Beschreibungen

Hinweis: Das CSS-Farbmodul führt die @-Regel @color-profile ein, zusammen mit ihren Deskriptoren components, rendering-intent und src. Diese Funktionen wurden noch in keinem Browser implementiert.

Funktionen

Hinweis: Das CSS-Farbmodul stellt die Funktionen device-cmyk() und contrast-color() vor, die noch in keinem Browser implementiert wurden.

Datentypen

Glossartermine und Schlüsselwörter

Schnittstellen

Hinweis: Das CSS-Farbmodul führt die CSSColorProfileRule-Schnittstelle ein, die in keinem Browser implementiert wurde.

Leitfäden

Farben auf HTML-Elemente anwenden mit CSS

Ein Leitfaden zur Verwendung von CSS, um Farbe auf verschiedene Arten von Inhalten anzuwenden, einschließlich aller CSS-Eigenschaften, die <color> als Wert akzeptieren.

CSS-Farbwerte

Eine Übersicht über Farbräume und die verschiedenen in CSS verfügbaren <color> funktionalen Notationen.

Farben weise verwenden

Farbtheorie und Ressourcen, einschließlich der Suche nach den richtigen Farben zur Erstellung einer barrierefreien Farbpalette, Kontrast und Drucken in Farbe.

Verwendung relativer Farben

Dieser Artikel erklärt relative CSS-Farbsyntax, zeigt, welche Optionen es gibt, und betrachtet einige illustrative Beispiele.

Verständnis von Farbe und Leuchtdichte

Farbwahrnehmung und Nutzung von Farben für farbunempfindliche (farbenblinde) Nutzer, Nutzer mit eingeschränktem Sehvermögen und Nutzer mit vestibulären Störungen oder anderen neurologischen Störungen.

WCAG 1.4.1: Farbkontrast

Erklärung der Kontrastanforderungen zwischen Hintergrund- und Vordergrundinhalten zur Sicherstellung der Lesbarkeit.

Verwandte Konzepte

Spezifikationen

Specification
CSS Color Module Level 4
CSS Color Module Level 5

Siehe auch