Farbkonverter & Farbwähler
Wählen Sie eine beliebige Farbe und erhalten Sie sofort die HEX-, RGB- und HSL-Werte. Mit einem Klick kopieren Sie jedes Format — ideal für CSS, Design-Tools und Code.
Ein Farbtool für Designer und Entwickler
Rechnen Sie in Echtzeit zwischen HEX, RGB und HSL um — und kopieren Sie die Werte direkt in Ihr CSS, Figma oder Ihre Design-Tokens.
Umrechnung in Echtzeit
Bearbeiten Sie ein beliebiges Format, und HEX, RGB und HSL werden im selben Moment neu berechnet. Kein Umwandeln-Button, keine Verzögerung.
Drei Formate synchron
HEX für Code, RGB für Berechnungen, HSL für intuitive Anpassungen. Alle drei bleiben verknüpft, sodass Sie Ihr Lieblingsformat wählen können.
Kopieren mit einem Klick
Jedes Format hat eine eigene Kopierschaltfläche, die CSS-fertige Werte in Ihre Zwischenablage legt. Fügen Sie sie direkt in Ihr Stylesheet ein.
Visueller Farbwähler
Wählen Sie jede Farbe visuell mit einem Farbwähler für das gesamte Spektrum. Ideal zum Aufnehmen, Feinabstimmen und Erkunden von Paletten.
CSS-fertige Ausgabe
Jedes Format wird als gültiges CSS ausgegeben — ohne Umformatieren, ohne Umwandeln. Funktioniert mit jedem modernen Browser und Design-Tool.
100 % privat — ohne Server
Alle Farbberechnungen laufen in Ihrem Browser. Farben, Paletten und Werte verlassen Ihr Gerät nie.
Wer den Farbkonverter nutzt
Vom CSS-Einsteiger bis zum Marketingteam, das ein Designsystem pflegt — ein Tool für jeden Workflow.
Webentwickler
Rechnen Sie Design-Tokens zwischen CSS Custom Properties, Tailwind-Konfigurationen und HEX-Codes aus dem Browser-Inspektor um.
- CSS-Variablen und Tailwind-Farben
- Figma-HEX für Themes in HSL umrechnen
- Farbabweichungen zwischen Plattformen finden
Designer
Halten Sie Paletten in Figma, Sketch, Adobe und im Web konsistent — rechnen Sie jeden Farbton sofort zwischen Farbsystemen um.
- HEX aus Figma für CSS exportieren
- Sättigung und Helligkeit mit HSL anpassen
- Markenfarben tool-übergreifend abgleichen
Marken- & Styleguide-Teams
Dokumentieren Sie Markenpaletten in allen Formaten, die Designer und Entwickler benötigen — HEX, RGB und HSL nebeneinander.
- Markenpaletten in drei Formaten erstellen
- Teilbare Farbspezifikationen erstellen
- Alte Farbcodes überprüfen
So rechnen Sie Farben um
Wählen Sie eine Farbe mit dem Farbwähler oder geben Sie einen HEX-, RGB- oder HSL-Wert direkt in ein beliebiges Eingabefeld ein.
Alle Formate werden sofort aktualisiert — HEX-, RGB- und HSL-Werte werden bei jeder Änderung in Echtzeit neu berechnet.
Klicken Sie neben einem beliebigen Format auf „Kopieren“, um den Wert in die Zwischenablage zu übernehmen — bereit zum Einfügen in CSS, Figma oder Code.
Weitere Tools entdecken
Entdecken Sie weitere kostenlose Tools, die sich gut mit diesem ergänzen
Bildkompressor
Dateigröße reduzieren, ohne Qualität zu verlieren
Bildgröße ändern
Bilder auf exakte Abmessungen skalieren
Hintergrundentferner
Hintergründe mit KI-Präzision entfernen
QR-Code-Generator
Eigene QR-Codes sofort erstellen
Bildkonverter
Zwischen über 30 Bildformaten konvertieren
PNG in WebP
Kleinere Dateien, gleiche Qualität fürs Web
Häufig gestellte Fragen
Antworten auf die häufigsten Fragen zur Umrechnung von Farben zwischen HEX, RGB und HSL.
Was ist der Unterschied zwischen HEX, RGB und HSL?
HEX (z. B. #FF5733) ist eine hexadezimale Darstellung, die in HTML und CSS verwendet wird. RGB (z. B. rgb(255, 87, 51)) definiert eine Farbe über ihre Rot-, Grün- und Blaukanäle. HSL (z. B. hsl(11, 100%, 60%)) definiert eine Farbe über Farbton, Sättigung und Helligkeit — für Designer bei kleinen Anpassungen oft intuitiver.
Kann ich einen HEX-Code direkt eingeben?
Ja. Klicken Sie in das HEX-Eingabefeld und geben Sie einen gültigen 6-stelligen HEX-Code (z. B. #3B82F6) ein oder fügen Sie ihn ein. Die RGB- und HSL-Werte werden automatisch aktualisiert. Sowohl das 3-stellige (#RGB) als auch das 6-stellige Format (#RRGGBB) wird unterstützt.
Werden die Farbdaten an einen Server gesendet?
Nein. Die gesamte Farbumrechnung erfolgt vollständig in Ihrem Browser mit JavaScript. Es wird nichts an einen Server gesendet.
Kann ich mit diesem Tool CSS-Farbwerte erhalten?
Ja — klicken Sie einfach neben HEX, RGB oder HSL auf „Kopieren“ und fügen Sie den Wert direkt in Ihr CSS ein. Alle drei Formate sind gültige CSS-Farbwerte, die von jedem modernen Browser unterstützt werden.