Eingabe
Dein Arbeitsbereich wird vorbereitet…
Anleitung
- HEX, RGB, HSL oder einen CSS-Farbnamen eingeben.
- Farbfläche und umgerechnete Werte prüfen.
- HEX, RGB oder HSL mit der jeweiligen Schaltfläche Kopieren übernehmen.
Eine Farbe, drei CSS-Formate
Ein Design-Token liegt vielleicht als HEX vor, während das Stylesheet RGB oder HSL verwendet. Eine andere Notation macht dieselbe Farbe wiederverwendbar.
Farbfläche und alle drei Ausgaben ändern sich gemeinsam. Auch CSS-Farbnamen wie rebeccapurple lassen sich in numerische Werte umwandeln.
Die Notation wählen
HEX ist kompakt für Design-Tokens; RGB zeigt Rot-, Grün- und Blaukanäle; HSL trennt Farbton, Sättigung und Helligkeit. Das sind Farbbeschreibungen, keine unterschiedlichen Bildformate.
Kurze und lange HEX-Werte werden akzeptiert. Unterstützte HEX-, RGB- und HSL-Syntax kann einen Alpha-Kanal enthalten.
#2563ebrgb(37, 99, 235)Dieselbe deckende sRGB-Farbe in HEX und RGB.
Transparenz und Genauigkeit
Transparente Farben behalten ihren Alpha-Kanal in der Ausgabe. Ihr Aussehen hängt weiterhin vom Hintergrund ab.
Das Tool arbeitet mit sRGB und rundet die angezeigte Notation. Es rechnet keine größeren Farbräume wie Lab, OKLCH oder CSS color() um.
Einen Wert verwenden
Kopiert wird der Farbwert, keine vollständige Deklaration. Verwende ihn bei color, background-color, border-color oder in einem Design-Token.
Texteingabe bis 1 MiB. CSS- und HTML-Umwandlungen laufen in einem Worker mit einem Zeitlimit von 30 Sekunden. Farbtools verwenden sRGB; generierte Styles sind Vorschauen und müssen im eigenen Layout getestet werden.
Häufige Fragen
Welche Formate kann ich eingeben?
Unterstützte HEX-, RGB- oder HSL-Werte sowie CSS-Farbnamen. Nicht unterstützte Syntax führt zu einem Fehler statt zu einem Ergebnis.
Bleibt Transparenz erhalten?
Ja. Ein unterstützter Alpha-Kanal wird in die Ausgabe übernommen. Prüfe die Farbe auf ihrem späteren Hintergrund.
Warum ändern sich Schreibweise oder Genauigkeit?
Die Ausgabe wird normalisiert und gerundet. Kurzschreibweise, Leerraum und die exakte numerische Schreibweise bleiben nicht erhalten.
Werden OKLCH oder Display P3 unterstützt?
Nein. Der Arbeitsbereich verwendet sRGB-Darstellungen und bildet keine größeren Farbräume auf sRGB ab.
Werden meine Farbwerte hochgeladen?
Nein. Umrechnung und Vorschau laufen im Browser. Kopieren schreibt nur den ausgewählten Wert in die Zwischenablage.