01
Eingabeformat kontrollieren
Kurzes und langes HEX sowie rgb(), hsl(), hsv(), cmyk(), lab() und oklch() werden gelesen. Fehlerhafte Komponenten lassen die letzte Probe stehen und sperren das Kopieren.
Farbwerkzeuge
Farbraum-Konverter— eine Farbe, sieben Werte
HEX, RGB, HSL, HSV, CMYK, Lab oder OKLCH eingeben und die Werte vergleichen.
Farbraum-Konverter
Die Farbe bleibt in diesem Browser-Tab; kein Upload und kein Verlauf.
HEX
#3B82F6RGB
rgb(59 130 246)HSL
hsl(217.2 91.2% 59.8%)HSV
hsv(217.2, 76%, 96.5%)CMYK
cmyk(76%, 47.2%, 0%, 3.5%)Lab
lab(54.619% 8.771 -65.783)OKLCH
oklch(62.308% 0.188 259.81)Innerhalb des sRGB-Farbraums.
sRGB und OKLCH verwenden D65, CSS Lab D50. CMYK ist eine Formel-Näherung ohne ICC-Profil.
Transparenz
Sieben Werte sind aktuell.
Ein HEX-Wert aus Figma soll in OKLCH stehen, während ein Druckentwurf CMYK verlangt. Der Farbraum-Konverter zeigt die gemeinsame Bildschirmfarbe und markiert den Punkt, an dem exakte Gleichheit endet.
HEX in RGB umrechnen, RGB in HSL umrechnen, OKLCH umrechnen oder eine CMYK Umrechnung prüfen: Der Farbraum-Konverter stellt das Farbfeld neben die Zahlen.
Warum dieser Farbraum-Konverter hilft
Original und Anzeige getrennt prüfen
Gamut-Verlust sichtbar machen
Lab und OKLCH können Farben außerhalb von sRGB beschreiben. Der Farbraum-Konverter bewahrt die Koordinaten und senkt für Vorschau und HEX nur die OKLCH-Buntheit. Eine Warnung kennzeichnet die Annäherung.
Alpha im Farbfeld erkennen
Vier- und achtstelliges HEX trägt Transparenz. Ein Schachbretthintergrund zeigt sie direkt; CSS-Ausgaben behalten Alpha, die CMYK-Näherung dagegen nicht.
Drei Prüfungen vor dem Kopieren
02
Alpha und Farbraum trennen
Der Alpha-Regler verändert die Deckkraft getrennt. Bei Lab oder OKLCH außerhalb des Gamuts Originaltext und angepasstes HEX vergleichen.
03
Nur aktuelle Werte übernehmen
Automatik startet 350 ms nach der letzten Eingabe. Im manuellen Modus löst Strg/Cmd+Enter die Umrechnung aus.
Sieben Modelle, unterschiedliche Aufgaben
Web-Farben
HEX, RGB und HSL geben dieselbe sRGB-Bildschirmfarbe in CSS-Schreibweisen aus. HSV benutzt die Value-Achse vieler Designwerkzeuge.
Wahrnehmungsbezogene Räume
CSS Lab bezieht sich auf Weißpunkt D50, OKLCH auf D65. Der Originalwert bleibt bei einer Gamut-Anpassung erkennbar.
Druck nur als Schätzung
CMYK wird aus den sRGB-Kanälen berechnet. Für Papier, Tinte und Maschine braucht die Druckerei ein eigenes ICC-Profil.
Grenzen dieser Umrechnung
- Gamut-Anpassung kostet Information
- Ein Lab- oder OKLCH-Wert außerhalb von sRGB hat kein exakt gleiches HEX. Die Vorschau verwendet geringere Buntheit und lässt das Original sichtbar.
- CMYK ersetzt kein Druckprofil
- Ohne ICC-Profil und Schwarzaufbau sind die Prozentwerte nur eine Näherung; sie sind keine druckfertige Separation.
- hsv() und cmyk() sind Werkzeugnotation
- Diese Werte dienen der Rechnung, nicht als versprochene CSS-Deklaration. Für CSS HEX, rgb(), hsl(), lab() oder oklch() wählen.
- Keine Palette und kein Speicher
- Es wird nur eine Farbe verarbeitet: kein Bildimport, Kontrasttest, Farbschema, Verlauf oder Teilen per URL.
Fragen zum Farbraum-Konverter
Sind Online-Farbumrechnungen genau?
Für definierte Farbräume sind die Koordinaten reproduzierbar; Rundung und Gamut-Anpassung können die Rückrechnung verändern.
Warum unterscheidet sich RGB zu CMYK von Photoshop?
Photoshop nutzt ein konkretes Druckprofil für Papier und Tinte. Hier fehlt dieses Profil; CMYK ist nur eine allgemeine Näherung.
Wird Display P3 außerhalb von sRGB vor der Umrechnung beschnitten?
Display P3 wird hier nicht als Eingabe unterstützt. Bei Lab und OKLCH außerhalb von sRGB wird allein die Bildschirmvorschau angepasst.
Was unterscheidet Lab D50, XYZ D50 und XYZ D65?
Lab nutzt D50, sRGB und OKLCH D65. Die Umrechnung von Lab erfolgt mit chromatischer Anpassung zwischen beiden Weißpunkten.
Werden meine Farben hochgeladen oder gespeichert?
Nein. Berechnung und Kopieren laufen lokal; die Eingabe wird weder hochgeladen noch gespeichert.
Noch eine Frage zu Farben?
Farbraum-Konverter ausprobieren
Einen Wert eingeben, Gamut-Hinweis lesen und erst dann die passende CSS-Notation kopieren.