» Farbkonverter


Farbkonverter für HEX, RGB, RGBA, HSL, HSLA, HSV/HSB, CMYK, LAB, LCH, OKLAB, OKLCH, XYZ und CSS-Farbnamen. Farbcodes live umrechnen, direkt kopieren und exakte CSS-Ausgaben an einer Stelle prüfen.

Nutzen Sie diesen Farbkonverter, um sofort zwischen HEX, RGB, RGBA, HSL, HSV/HSB, CMYK, LAB, LCH, OKLAB, OKLCH, XYZ und CSS-Farbnamen zu wechseln. Geben Sie ein beliebiges unterstütztes Format ein, passen Sie Werte mit Schiebereglern an und kopieren Sie das umgerechnete Ergebnis für CSS, Designsysteme, Druck-Workflows oder Farbanalysen.

Der Konverter aktualisiert alle Ausgaben live, zeigt die ausgewählte Farbe klar an und unterstützt Rückwärtsberechnungen aus jedem Eingabemodus. Dadurch eignet er sich für Aufgaben wie HEX zu RGB, RGB zu HEX, das Prüfen von HSL- oder CMYK-Werten oder den Vergleich moderner wahrnehmungsorientierter Formate wie OKLCH und OKLAB.

Anfangsdaten

Wählen Sie ein beliebiges Format, geben Sie Werte ein und alle passenden Farbcodes werden sofort aktualisiert.

Eingabeformat
Wählen Sie das Format, das Sie direkt bearbeiten möchten.
Unterstützt #RGB, #RGBA, #RRGGBB und #RRGGBBAA.
Beispiele: tomato, rebeccapurple, royalblue, lightseagreen.
Geben Sie Rot-, Grün- und Blauwerte von 0 bis 255 ein.
Verwenden Sie einen Alpha-Wert von 0 bis 1 für Transparenz.
Passen Sie Farbton, Sättigung und Helligkeit für CSS-freundliche Bearbeitung an.
HSLA ergänzt HSL um Alpha-Transparenz.
HSV ist nützlich, wenn Sie in Farbton, Sättigung und Helligkeit denken möchten.
CMYK wird hauptsächlich für druckorientierte Farbwerte verwendet.
LAB ist wahrnehmungsorientiert und kann Bildschirmfarben außerhalb des darstellbaren Farbraums erzeugen.
LCH trennt Helligkeit, Chroma und Farbton für wahrnehmungsorientierte Bearbeitung.
OKLAB ist ein moderner wahrnehmungsorientierter Farbraum für UI- und Palettenarbeit.
OKLCH erleichtert wahrnehmungsorientierte Anpassungen von Farbton und Chroma.
XYZ ist ein Referenzfarbraum, der oft für Umrechnungen verwendet wird.

Abb. 1 Farbkonverter


HEX #3366CC
RGB rgb(51, 102, 204)
CMYK cmyk(75%, 50%, 0%, 20%)
Im Farbmodus können Sie Farbton, Sättigung und Helligkeit anpassen.

Ergebnis

Umgerechnete Farbwerte

Am häufigsten verwendet

Weitere Formate

Farbkonverter FAQ

Was ist ein Farbkonverter?
Ein Farbkonverter nimmt ein Farbformat wie #3366cc oder rgb(51, 102, 204) und berechnet die passenden Werte in anderen Formaten wie HSL, CMYK, LAB oder OKLCH.

Wie konvertiere ich HEX in RGB?
Wählen Sie den Eingabemodus HEX, geben Sie einen gültigen Hex-Code wie #ff6600 ein, und der Konverter zeigt automatisch die passenden RGB-, HSL-, CMYK- und weiteren Werte an.

Wie konvertiere ich RGB in HEX?
Wählen Sie den Modus RGB, geben Sie die Werte für Rot, Grün und Blau ein und kopieren Sie das erzeugte HEX-Ergebnis. Das ist der Standardablauf für RGB zu HEX bei Webfarben.

Was ist HSL?
HSL steht für Farbton, Sättigung und Helligkeit. Es beschreibt eine Farbe über ihren Winkel im Farbkreis sowie darüber, wie intensiv und wie hell oder dunkel sie wirkt. Das lässt sich oft leichter visuell anpassen als rohe RGB-Werte.

Wofür wird CMYK verwendet?
CMYK wird hauptsächlich in Druck-Workflows verwendet, weil es eine Farbe als Anteile von Cyan-, Magenta-, Gelb- und Schwarzfarbe beschreibt. Das ist nützlich für Druckvorlagen, Verpackungen und Printproduktion.

Was ist OKLCH?
OKLCH ist ein wahrnehmungsorientiertes Farbformat, das aus OKLAB abgeleitet ist. Es trennt Helligkeit, Chroma und Farbton auf eine Weise, die für das menschliche Sehen oft gleichmäßiger wirkt. Das macht es nützlich für moderne UI-Paletten und Designsysteme.

Sind die Umrechnungen exakt?
Umrechnungen innerhalb desselben Farbraums können exakt oder sehr nahe sein, aber einige Formate verwenden unterschiedliche Modelle oder Referenzräume. Werte wie CMYK, LAB, LCH und OKLCH können Rundungen oder Gamut-Clipping erfordern, wenn sie zurück in darstellbares sRGB konvertiert werden.

Kann ich die Ergebnisse in CSS verwenden?
Ja. Die erzeugten HEX-, RGB-, RGBA-, HSL-, HSLA- und exakten CSS-Farbnamen können direkt in CSS-Variablen, Inline-Styles und Design-Tokens eingefügt werden.