Farbkonverter
Farben zwischen HEX-, RGB- und HSL-Formaten konvertieren
Was ist der Farbkonverter?
Erstellt und gepflegt vom BitConvert-Team · Feb 27, 2026
Der Farbkonverter übersetzt eine einzelne Farbe zwischen den drei im Web am häufigsten verwendeten Notationen: HEX (die in CSS verwendete hexadezimale Form #RRGGBB), RGB (Rot-, Grün- und Blaukanäle von 0 bis 255) und HSL (Farbton in Grad mit Sättigung und Helligkeit in Prozent). Geben Sie einen Wert in einem Modell ein und er berechnet sofort die Entsprechungen in den anderen.
Ein visueller Farbwähler und eine Live-Vorschau lassen Sie einen Farbton begutachten und die exakten Codes ablesen, während jeder Wert synchron bleibt, sobald Sie einen davon anpassen. Da HEX, RGB und HSL alle denselben additiven Bildschirm-Farbraum beschreiben, sind die Umrechnungen zwischen ihnen exakt – keine Rundungsüberraschungen, wenn Sie eine Markenfarbe aus einem Designtool in ein Stylesheet übernehmen.
Hauptfunktionen
HEX, RGB & HSL
Konvertieren Sie zwischen den drei Notationen, auf die CSS und Designtools setzen, wobei die Werte synchron bleiben, während Sie ein beliebiges Feld bearbeiten.
Live-Vorschau
Ein Farbfeld aktualisiert sich beim Tippen oder Auswählen und zeigt genau, wie der aktuelle Wert auf dem Bildschirm aussieht.
Visueller Farbwähler
Ziehen Sie durch den Farbwähler, um Farbtöne zu erkunden und ihre Codes sofort in jedem Format abzulesen.
Beliebiges Format kopieren
Kopieren Sie die HEX-, RGB- oder HSL-Zeichenkette mit einem Klick, um sie direkt in ein Stylesheet oder eine Designdatei einzufügen.
Häufige Anwendungsfälle
Wandeln Sie einen Marken-HEX-Code in einen rgb()-Wert um, damit Sie in CSS mit rgba() Transparenz hinzufügen können. Passen Sie eine Farbe mit HSL an, um in einem Designsystem hellere oder dunklere Varianten für Hover-Zustände und Farbtöne zu erstellen. Treffen Sie eine aus einem Mockup gewählte Farbe, indem Sie ihre exakten RGB- und HEX-Werte für eine saubere Übergabe an Entwickler ablesen. Übersetzen Sie schnell die HSL-Wahl eines Designers in den HEX-Code, den Ihre Codebasis erwartet.
Häufig gestellte Fragen
Zuletzt aktualisiert: Feb 27, 2026