CSS-Farben

Der Farbsyntax-Konverter unten zeigt die Werte der aktuell ausgewählten Farbe in rot-grün-blau (RGB), hexadezimal (HEX), Farbton, Sättigung und Helligkeit (HSL) und Farbton, Weißgrad und Schwarzgrad (HWB) CSS-Farbformaten. Alle RGB-, HEX-, HSL- und HWB-Farbwerte hier repräsentieren, obwohl unterschiedlich geschrieben, denselben Farbwert.

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 respektive accent-color.

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

• color
• opacity

• @color-profile
  • components Deskriptor
  • rendering-intent Deskriptor
  • src Deskriptor

• Farb-Funktionen:
  • rgb()
  • hsl()
  • hwb()
  • lab()
  • lch()
  • oklab()
  • oklch()
  • color()
• color-contrast() Experimentell
• color-mix()
• device-cmyk()
• light-dark()

• <color>
• <color-function>
• <hex-color>
• <named-color>
• <alpha-value>
• <hue>
• <system-color>
• <colorspace-params>

• Farbraum
• currentcolor
• Interpolation
• RGB
• transparent

• CSSColorProfileRule

Farbe 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

Ein Überblick über Farbräume und die verschiedenen <color>-Funktionsnotationen, die in CSS verfügbar sind.

Farbe weise verwenden

Farbtheorie und Ressourcen, einschließlich der Suche nach den richtigen Farben, um eine zugängliche Farbpalette, Kontrast und Farbdruck zu erstellen.

Relative Farben verwenden

Dieser Artikel erklärt die relative CSS-Farbsyntax, zeigt die verschiedenen Optionen und einige illustrative Beispiele.

Verständnis von Farbe und Leuchtdichte

Farbwahrnehmung und die Verwendung von Farben mit farbensensitiven (farbenblinden) Nutzern, Nutzern mit eingeschränktem Sehvermögen und Nutzern mit vestibulären Störungen oder anderen neurologischen Störungen.

WCAG 1.4.1: Farbkontrast

Erklärung der Kontrastanforderungen zwischen Hintergrund und Vordergrundinhalten, um die Lesbarkeit zu gewährleisten.

• CSS-Eigenschaften, die Teil anderer Spezifikationen sind:
  • accent-color
  • background-color
  • background-image
  • border-color
  • box-shadow
  • caret-color
  • color
  • color-scheme
  • column-rule-color
  • outline-color
  • scrollbar-color
  • text-decoration-color
  • text-emphasis-color
  • text-shadow
  • -webkit-tap-highlight-color
• SVG-Farbeigenschaften, die Teil anderer Spezifikationen sind:
  • fill
  • flood-color
  • lighting-color
  • stop-color
  • stroke
• SVG color Attribut
• Farbkreis Glossarbegriff
• Interpolation Glossarbegriff
• Die @font-palette-values At-Regel override-colors Deskriptor
• Die @color-profile At-Regel
• Die color-gamut @media-Funktion
• Die forced-colors @media-Funktion

• CSS-Farbanpassung Modul und die print-color-adjust Eigenschaft.
• CSS-Bilder Modul, in dem CSS <gradient> Bilder definiert sind.
• Die VideoColorSpace Schnittstelle
• Das SVG <feColorMatrix> Element
• Canvas API: Stile und Farben anwenden