So konvertieren Sie Farben zwischen HEX, RGB und HSL
Webdesigner und Entwickler arbeiten häufig mit Farben in unterschiedlichen Formaten über Projekte, Designsysteme und Tools hinweg. Ganz gleich, ob Sie zwischen einem Designmodell in HSL, einer CSS-Datei mit RGB oder einer Markenrichtlinie in HEX wechseln: Wenn Sie wissen, wie Sie schnell zwischen diesen Formaten konvertieren, sparen Sie Zeit und vermeiden Fehler.
Die drei wichtigsten Farbformate verstehen
Die HEX-Notation (hexadezimal) stellt Farben als sechsstellige Codes dar #FF5733, wobei Zeichenpaare die Intensität von Rot, Grün und Blau definieren. RGB (Rot, Grün, Blau) verwendet für jeden Farbkanal Dezimalwerte von 0 bis 255 – zum Beispiel rgb(255, 87, 51). HSL (Farbton, Sättigung, Helligkeit) beschreibt die Farbe mithilfe eines Winkels für den Farbton (0–360°), eines Prozentsatzes für die Sättigung (0–100 %) und eines Prozentsatzes für die Helligkeit (0–100 %), geschrieben als hsl(9, 100%, 60%).
Warum zwischen Formaten konvertieren?
Unterschiedliche Tools und Kontexte begünstigen unterschiedliche Formate. Designer arbeiten häufig mit HSL, da sich Helligkeit und Sättigung damit intuitiv anpassen lassen. Webentwickler verwenden RGB oder HEX in CSS-Stylesheets. Für die Druckproduktion ist möglicherweise ein anderer Farbraum erforderlich. Durch das Konvertieren können Sie Arbeiten zwischen Werkzeugen verschieben, ohne die Farben manuell neu festlegen zu müssen.
So funktioniert die Konvertierung
Beim Konvertieren zwischen Formaten sind mathematische Beziehungen erforderlich. HEX-zu-RGB ist unkompliziert: Teilen Sie die sechs Zeichen in drei Paare auf und konvertieren Sie jedes von Hexadezimal (Basis 16) in Dezimal (Basis 10). RGB-zu-HSL ist komplexer, da die maximalen und minimalen Kanalwerte ermittelt und dann Farbton, Sättigung und Helligkeit abgeleitet werden. Die umgekehrten Prozesse wenden inverse Mathematik an, um zurückzugehen.
Farben online konvertieren
Die manuelle Berechnung ist bei wiederholten Umrechnungen fehleranfällig. Verwenden Farbkonverter um sofort zwischen HEX, RGB und HSL umzuwandeln. Fügen Sie eine Farbe in ein beliebiges Format ein und sehen Sie die Entsprechungen in allen anderen, sodass Sie die Mathematik nicht selbst verstehen müssen.
Sorgen Sie für eine zugängliche Farbauswahl
Nachdem Sie eine Farbe konvertiert haben, überprüfen Sie mithilfe von, ob sie den Barrierefreiheitsstandards entspricht Kontrastprüfer um einen ausreichenden Kontrast zu Ihrem Text sicherzustellen. Wenn Sie Designinspiration benötigen, Zufälliger Farbgenerator erstellt neue Paletten, die Sie dann in Ihr bevorzugtes Format konvertieren können.
Datenschutz: Farben bleiben auf Ihrem Gerät
Der Farbkonverter verarbeitet jede Konvertierung in Ihrem Browser – es werden keine Daten an einen Server gesendet. Ihre Farbpaletten, in Arbeit befindlichen Designs und Markenspezifikationen bleiben auf Ihrem Gerät privat. Das Tool funktioniert nach dem Laden der Seite offline, sodass Sie mit der Farbkonvertierung ohne Internetzugang fortfahren können.