CSS Farben

Der untenstehende Farbsyntax-Konverter 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ßton und Schwarzton (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 Opazität über den Schieberegler aktualisiert die RGB-, HEX-, HSL- und HWB-Werte. Wenn Sie einen neuen Farb- oder Opazitätswert auswählen, aktualisieren sich die Farbe des Hintergrunds und der Schieberegler über die CSS-Eigenschaften background-color und accent-color, jeweils.

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

• color
• opacity

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

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

• Farbraum
• currentcolor
• Interpolation
• RGB
• transparent

Farbe auf HTML-Elemente mit CSS anwenden

Ein Leitfaden zur Verwendung von CSS, um Farbe für 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> Funktionalnotationen, die in CSS verfügbar sind.

Farbe weise verwenden

Farbtheorie und Ressourcen, einschließlich der richtigen Farben zu finden, um eine zugängliche Farbpalette zu erstellen, Kontrast und Drucken in Farbe.

Verwendung relativer Farben

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

Verstehen von Farbe und Leuchtdichte

Farbempfindung und die Verwendung von Farben mit farbunempfindlichen (farbenblinden) Benutzern, Benutzern mit eingeschränktem Sehvermögen und Benutzern mit vestibulären oder anderen neurologischen Störungen im Blick.

WCAG 1.4.1: Farbkontrast

Erklärung der Kontrastanforderungen zwischen Hintergrund- und Vordergrundinhalten, um Lesbarkeit sicherzustellen.

• 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-Farben-Eigenschaften, 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-rule override-colors Beschreibungszeiger
• Die @color-profile at-rule
• Die color-gamut @media Funktion
• Die forced-colors @media Funktion

• CSS Farbkorrektur Modul und die print-color-adjust Eigenschaft.
• CSS Bilder Modul, wo CSS <gradient> Bilder definiert sind.
• Die VideoColorSpace Schnittstelle
• Das SVG <feColorMatrix> Element
• Canvas API: Anwendung von Stilen und Farben