PixConvert

Farbkonverter & Farbauswahl

Wählen Sie eine beliebige Farbe und erhalten Sie sofort deren HEX-, RGB- und HSL-Werte. Klicken Sie, um jedes Format zu Kopie – ideal für CSS, Design-Tools und Code.

#3B82F6
VERHEXEN
RGB
HSL

Ein Farbwerkzeug für Designer und Entwickler

Konvertieren Sie in Echtzeit zwischen HEX, RGB und HSL – und Kopie anschließend direkt in Ihr CSS, Figma oder Ihre Design-Tokens.

Echtzeitkonvertierung

Bearbeiten Sie jedes beliebige Format und beobachten Sie, wie HEX, RGB und HSL in dem Moment neu berechnet werden, in dem Sie tippen. Kein konvertieren. , keine Verzögerung.

Drei Formate im Einklang

HEX für Code, RGB für mathematische Berechnungen, HSL für intuitive Anpassungen. Alle drei sind miteinander verknüpft, sodass Sie Ihre bevorzugte Darstellungsform auswählen können.

Ein-Klick-Kopieren

Jedes Format verfügt über eine eigene Kopie , die CSS-fähige Werte in die Zwischenablage kopiert. Diese können Sie direkt in Ihr Stylesheet einfügen.

Visuelle Farbauswahl

Wählen Sie jede beliebige Farbe visuell mit einem Vollspektrum-Farbwähler. Ideal zum Testen, Feinabstimmen und Erkunden von Farbpaletten.

CSS-fähige Ausgabe

Jedes Format wird als gültiges CSS ausgegeben – keine Umformatierung, keine Typumwandlung. Funktioniert mit allen modernen Browsern und Design-Tools.

100 % privat – Kein Server

Die gesamte Farbberechnung erfolgt in Ihrem Browser. Farben, Paletten und Werte verlassen niemals Ihr Gerät.

Wer verwendet den Farbkonverter?

Von CSS-Neulingen bis hin zu Markenteams, die ein Designsystem pflegen – ein Tool, jeder Workflow.

Webentwickler

Konvertiert Design-Tokens zwischen CSS-Custom-Properties, Tailwind-Konfigurationen und HEX-Codes, die aus dem Browser-Inspektor abgerufen werden.

  • CSS-Variablen und Tailwind-Farben
  • Figma-HEX in HSL für Themes konvertieren
  • Farbabweichungen zwischen verschiedenen Plattformen beheben

Designer

Sorgen Sie für einheitliche Farbpaletten in Figma, Sketch, Adobe und im Web – konvertieren. jeden Farbton sofort zwischen verschiedenen Farbsystemen.

  • Exportieren Sie HEX-Dateien aus Figma nach CSS.
  • Mit HSL die Sättigung und Helligkeit anpassen
  • Markenfarben auf allen Werkzeugen angleichen

Marken- und Styleguide-Teams

Dokumentieren Sie Markenpaletten in allen Formaten, die Designer und Entwickler benötigen – HEX, RGB und HSL nebeneinander.

  • Dreifachformat-Markenpaletten generieren
  • Erstellen Sie teilbare Farbspezifikationen
  • Überprüfung veralteter Farbcodes

So konvertieren Sie Farben

1

Wählen Sie eine Farbe mit dem Farbwähler oder geben Sie einen HEX-, RGB- oder HSL-Wert direkt in ein beliebiges Eingabefeld ein.

2

Alle Formate werden sofort aktualisiert – HEX-, RGB- und HSL-Werte werden in Echtzeit neu berechnet, sobald Sie Änderungen vornehmen.

3

Klicken Sie auf die Schaltfläche „Kopieren“ neben einem beliebigen Format, um den Wert in Ihre Zwischenablage zu Kopie , sodass Sie ihn anschließend in CSS, Figma oder Code einfügen können.

Häufig gestellte Fragen

Antworten auf die häufigsten Fragen zur Umrechnung von Farben zwischen HEX, RGB und HSL.

Worin besteht der Unterschied zwischen HEX, RGB und HSL?

HEX (z. B. #FF5733) ist eine hexadezimale Farbdarstellung, die in HTML und CSS verwendet wird. RGB (z. B. rgb(255, 87, 51)) definiert eine Farbe durch ihre Rot-, Grün- und Blaukanäle. HSL (z. B. hsl(11, 100%, 60%)) definiert eine Farbe durch ihren Farbton, ihre Sättigung und ihre Helligkeit – oft intuitiver für Designer, die nur kleine Anpassungen vornehmen.

Kann ich einen HEX-Code direkt eingeben?

Ja. Klicken Sie auf das HEX-Eingabefeld und geben Sie einen gültigen 6-stelligen Hexadezimalcode ein oder fügen Sie ihn ein (z. B. #3B82F6). Die RGB- und HSL-Werte werden automatisch aktualisiert. Sowohl 3-stellige (#RGB) als auch 6-stellige (#RRGGBB) Formate werden unterstützt.

Werden die Farbdaten an einen Server gesendet?

Nein. Die gesamte Farbkonvertierung findet ausschließlich in Ihrem Browser mithilfe von JavaScript statt. Es werden keine Daten an einen Server gesendet.

Kann ich dieses Tool verwenden, um CSS-Farbwerte zu 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.