Farbformate-Referenz

Definitionen, Wertebereiche und Verwendung für 11 Farbformate einschließlich HEX, RGB, HSL, CMYK und OKLCH.

HEX

Ein 6-stelliger hexadezimaler Farbcode mit dem Präfix #. Jedes Ziffernpaar repräsentiert die Rot-, Grün- und Blaukanäle in Basis 16 (00-FF).

When to use
Das gebräuchlichste Format im Webdesign und CSS. Verwendet in HTML, CSS, Design-Tools und Versionskontrolle.
Value ranges
#000000 (Schwarz) bis #FFFFFF (Weiß). Unterstützt 3-stellige Kurzform (#RGB) und 8-stelliges Alpha (#RRGGBBAA).
CSS support
In allen CSS-Versionen unterstützt.
Try in Color Converter →

RGB

Stellt Farben mit Rot-, Grün- und Blaukanälen dar, jeweils im Bereich von 0 bis 255. Basiert auf additiver Farbmischung — der Art, wie Bildschirme Licht ausstrahlen.

When to use
Standard für digitale Displays, Bildbearbeitung und programmatische Farbmanipulation.
Value ranges
R: 0-255, G: 0-255, B: 0-255
CSS support
In allen CSS-Versionen als rgb() und rgba() unterstützt.
Try in Color Converter →

HSL

Definiert Farbe durch Farbton (Winkel auf dem Farbkreis), Sättigung (Intensität) und Helligkeit (Leuchtkraft). Intuitiver als RGB für manuelle Farbauswahl.

When to use
Ideal zum Erzeugen von Farbvariationen — Helligkeit für Schattierungen/Abtönungen, Sättigung für Intensität anpassen.
Value ranges
H: 0-360°, S: 0-100%, L: 0-100%
CSS support
In CSS3+ als hsl() und hsla() unterstützt.
Try in Color Converter →

CMYK

Cyan, Magenta, Gelb, Schlüssel (Schwarz). Ein subtraktives Farbmodell, das in der Druckproduktion verwendet wird, wo Tinten Licht absorbieren statt es auszustrahlen.

When to use
Erforderlich für Druckdesign und Druckvorstufen-Workflows. Nicht direkt in CSS unterstützt.
Value ranges
C: 0-100%, M: 0-100%, Y: 0-100%, K: 0-100%
CSS support
Nicht in CSS unterstützt.
Try in Color Converter →

HSB / HSV

Farbton, Sättigung, Helligkeit (auch HSV genannt — Farbton, Sättigung, Wert). Ähnlich wie HSL, verwendet aber Helligkeit statt Leuchtkraft, entsprechend der Funktionsweise vieler Farbwähler.

When to use
Verbreitet in Design-Tools wie Adobe Photoshop und Figma für deren Farbwähler.
Value ranges
H: 0-360°, S: 0-100%, B: 0-100%
CSS support
Nicht direkt in CSS unterstützt.
Try in Color Converter →

CIELAB (LAB)

Ein wahrnehmungsmäßig gleichförmiger Farbraum, in dem gleiche numerische Änderungen ungefähr gleichen wahrgenommenen Farbunterschieden entsprechen. Besteht aus Helligkeit (L), Grün-Rot-Achse (a) und Blau-Gelb-Achse (b).

When to use
Verwendet für genaue Farbdifferenzberechnungen (Delta-E), Farbkorrektur und geräteunabhängige Farbdarstellung.
Value ranges
L: 0-100, a: -128 bis 127, b: -128 bis 127
CSS support
In CSS Color Level 4 als lab() unterstützt.
Try in Color Converter →

CIE XYZ

Ein geräteunabhängiger Farbraum, definiert von der Internationalen Beleuchtungskommission. Dient als mathematische Grundlage für die meisten anderen Farbräume.

When to use
Verwendet als Zwischenschritt bei Farbraumkonvertierungen und für kolorimetrische Berechnungen.
Value ranges
X: 0-95,047, Y: 0-100, Z: 0-108,883 (D65-Lichtart)
CSS support
Nicht direkt in CSS unterstützt.
Try in Color Converter →

LCH

Die zylindrische Form von CIELAB, mit Helligkeit, Chroma (Farbintensität) und Farbton (Winkel). Intuitiver als LABs a/b-Achsen bei Beibehaltung der wahrnehmungsmäßigen Gleichförmigkeit.

When to use
Bevorzugt gegenüber LAB, wenn Chroma oder Farbton unabhängig angepasst werden müssen und die wahrnehmungsmäßige Gleichförmigkeit beibehalten werden soll.
Value ranges
L: 0-100, C: 0-150+, H: 0-360°
CSS support
In CSS Color Level 4 als lch() unterstützt.
Try in Color Converter →

OKLCH

Ein moderner wahrnehmungsbezogener Farbraum, der LCH mit besserer Farbtongleichförmigkeit verbessert. Von Björn Ottosson entwickelt, um Farbtonverschiebungen in CIELAB-basierten Räumen zu beheben.

When to use
Empfohlen für die Einführung von CSS Color Level 4. Bietet die gleichmäßigste Helligkeits-, Chroma- und Farbtonmanipulation aller weit unterstützten Farbräume.
Value ranges
L: 0-1, C: 0-0,4+, H: 0-360°
CSS support
In CSS Color Level 4 als oklch() unterstützt. Browser-Unterstützung wächst.
Try in Color Converter →

HWB

Farbton, Weißgrad, Schwarzgrad. Beschreibt Farbe durch ihren Farbtonwinkel, dann wie viel Weiß und Schwarz beigemischt sind. Gilt als das intuitivste Farbmodell für Menschen.

When to use
Leicht verständlich für nicht-technische Benutzer. Weißgrad hinzufügen erzeugt Pastelltöne, Schwarzgrad hinzufügen erzeugt tiefere Töne.
Value ranges
H: 0-360°, W: 0-100%, B: 0-100%
CSS support
In CSS Color Level 4 als hwb() unterstützt.
Try in Color Converter →

CIELUV (LUV)

Ein wahrnehmungsmäßig gleichförmiger Farbraum, optimiert für additive Farbmischung (Licht). Ähnlich wie CIELAB, aber besser geeignet für Anwendungen mit Beleuchtung.

When to use
Verwendet in Lichtdesign, Fernseh-Farbwissenschaft und Anwendungen mit ausgestrahltem statt reflektiertem Licht.
Value ranges
L: 0-100, u: -134 bis 224, v: -140 bis 122
CSS support
Nicht in CSS unterstützt.
Try in Color Converter →