Was ist ein Farbkonverter?
Ein Farbkonverter übersetzt einen Farbwert in die Formate, die häufig im Webdesign, in CSS, in Designsystemen und in Handover-Notizen verwendet werden. Eine einzelne Markenfarbe kann als HEX im Styleguide, als RGB in einem Design-Token, als HSL im Theme-Editor und als CMYK in druckbezogenen Notizen gespeichert sein. Dieses Tool hält diese Darstellungen zusammen, damit Sie die richtige Version kopieren können, ohne von Hand neu zu berechnen.
Der Konverter ist bewusst kompakt gehalten. Er konzentriert sich auf praktische sRGB-Webfarben: HEX, RGB, HSL, HSV und eine einfache CMYK-Annäherung. Er versucht nicht, professionelle Farbmanagement-Software oder ICC-Profil-Workflows zu ersetzen.
Unterstützte Farbformate
| Format | Example | Am besten geeignet für |
|---|---|---|
| HEX | #3366FF | CSS, Design-Tokens, schnelle visuelle Übergabe |
| RGB | rgb(51, 102, 255) | CSS-Werte, Canvas-Arbeit, programmatische Farbkanäle |
| HSL | hsl(225, 100%, 60%) | Anpassungen im Theme nach Farbton, Sättigung und Helligkeit |
| HSV | hsv(225, 80%, 100%) | Workflows im Stil von Farbwählern und visuelles Feintuning |
| CMYK | cmyk(80%, 60%, 0%, 0%) | Ungefähre Druckhinweise, keine endgültige Druckfarbverwaltung |
Wichtige Einschränkungen
- Die CMYK-Ausgabe wird aus sRGB-Werten berechnet und ist nur eine Annäherung.
- CSS-named colors, Verläufe, Lab, LCH, OKLCH und Display-P3 liegen außerhalb dieses kompakten v1-Scopes.
- Alpha-Werte können für gängige HEX-/RGB-/HSL-Formate geparst werden, aber die native Farbvorschau zeigt die undurchsichtige Grundfarbe.
- Verschiedene Design-Tools können HSL-, HSV- oder CMYK-Werte leicht unterschiedlich runden.
Gängige Arbeitsabläufe
CSS-Bereinigung
Fügen Sie eine HEX-Farbe aus einem Styleguide ein und kopieren Sie RGB oder HSL für einen Komponentenstatus, eine Chart-Palette oder eine Theme-Variable.
Design-Übergabe
Bewahren Sie mehrere Farbnotationen zusammen auf, wenn Entwickler, Designer oder Content-Editoren unterschiedliche Tools verwenden.
Überprüfung von Tokens
Prüfen Sie, ob sich ein Farb-Token in Bezug auf Farbton und Sättigung wie erwartet abbildet, bevor Sie es in einer öffentlichen UI verwenden.
Druckhinweise
Erzeugen Sie ungefähre CMYK-Werte zur Diskussion und überlassen Sie die endgültige Druckausgabe profilgestützten Tools.
Häufig gestellte Fragen
Ist die CMYK-Ausgabe exakt?
Nein. Der CMYK-Wert ist eine einfache Umrechnung aus sRGB und eignet sich für grobe Notizen. Die endgültige Druckarbeit hängt von Papier, Tinte, Druckeinstellungen und ICC-Profilen ab.
Kann ich CSS-Farbfunktionen einfügen?
Ja, für gängige RGB-, HSL-, HSV- und CMYK-ähnliche Funktionssyntax. Neuere Farbräume wie Lab, LCH, OKLCH und Display-P3 sind bewusst außerhalb dieses kompakten Tools.
Unterstützt das Tool Alpha-Transparenz?
Es kann gängige Alpha-Formate wie RGBA, HSLA und achtstellige HEX-Werte parsen, aber die Hauptvorschau und die Kopierausgabe konzentrieren sich auf praktikable undurchsichtige Webfarben.
Warum weichen Werte manchmal von einem anderen Design-Tool ab?
Kleine Unterschiede entstehen in der Regel durch Rundungsregeln oder Annahmen im Farbmanagement. Bei Web-sRGB-Farben sind diese Unterschiede normalerweise sehr klein.
Wann sollte ich stattdessen den Kontrastprüfer verwenden?
Verwenden Sie den Kontrastprüfer, wenn Sie zwei Farben auf Textlesbarkeit vergleichen müssen. Dieser Konverter wandelt nur eine Farbe zwischen Formaten um.