Farbkonverter

Was ist Farbkonverter?

Color Converter ist ein kostenloser Online-Farbkonverter von HEX zu RGB zu HSL für Entwickler und Designer. Gib eine Farbe in beliebiger Notation ein — HEX (#rrggbb oder die Kurzform #rgb), RGB (etwa "255, 100, 0" oder "rgb(255 100 0)") oder HSL (etwa "220, 91%, 64%") — und jedes andere Format wird sofort neben einer großen Live-Vorschaufläche aktualisiert. Mit einem nativen Farbwähler kannst du einen Farbton visuell auswählen, und jeder Wert hat eine Ein-Klick-Kopierschaltfläche, sodass es praktisch ist, wann immer du Markenfarben abgleichen oder CSS-Farbwerte zwischen Code und Designtools übertragen musst.

So verwendest du Farbkonverter

1. Tippe oder füge eine Farbe in das HEX-, RGB- oder HSL-Feld ein oder klicke auf die Farbfläche des Farbwählers, um einen Farbton visuell auszuwählen.
2. Beobachte, wie sich die anderen beiden Felder und die große Vorschaufläche sofort aktualisieren und dieselbe Farbe widerspiegeln.
3. Lies die R / G / B-, H / S / L- und HEX-Übersichtskacheln darunter, um die umgerechneten Kanalwerte zu sehen.
4. Klicke auf die Kopierschaltfläche neben einem Feld, um seinen Wert zu kopieren: HEX kopiert die Zeichenfolge #rrggbb, während RGB und HSL gebrauchsfertige rgb(...)- und hsl(...)-Zeichenfolgen kopieren.
5. Wird ein Wert abgelehnt, prüfe die Inline-Fehlermeldung und gib ihn im Format wieder ein, das der Feldhinweis vorgibt.

Beispiele

#ff6400

RGB 255, 100, 0 / HSL 24, 100%, 50%

#fff

HEX #ffffff / RGB 255, 255, 255 / HSL 0, 0%, 100%

Häufig gestellte Fragen

Welche Farbformate unterstützt dieser Konverter?

Er konvertiert zwischen drei Formaten: HEX (vollständiges #rrggbb und die Kurzform #rgb), RGB (0-255 pro Kanal) und HSL (Farbton in Grad, Sättigung und Helligkeit in Prozent). Alpha/Deckkraft, HSV, CMYK oder benannte CSS-Farben werden derzeit nicht unterstützt.

Warum zeigt meine Farbe einen Fehler "Invalid HEX color", "Invalid RGB color" oder "Invalid HSL color"?

Der Wert entspricht nicht dem erwarteten Format oder liegt außerhalb des gültigen Bereichs. HEX muss aus 3 oder 6 Hexadezimalziffern bestehen, RGB-Kanäle müssen zwischen 0-255 liegen, und Sättigung und Helligkeit von HSL müssen zwischen 0-100% liegen. Gib ihn entsprechend dem Hinweis unter diesem Feld erneut ein.

Kann ich einen vollständigen CSS-Wert wie rgb(255 100 0) einfügen?

Ja. Die RGB- und HSL-Felder ziehen einfach die Zahlen aus dem Text, sodass sowohl "255, 100, 0" als auch "rgb(255 100 0)" funktionieren, und die Kopierschaltflächen geben gebrauchsfertige rgb(...)- und hsl(...)-Zeichenfolgen aus.

Werden die umgerechneten Werte gerundet?

Ja. RGB-Kanäle und HSL-Werte werden auf ganze Zahlen gerundet, sodass eine Hin-und-zurück-Konvertierung um eine Einheit vom Original abweichen kann. Die HEX-Ausgabe hat immer zwei Ziffern pro Kanal (#rrggbb).

Werden meine Farbdaten irgendwohin hochgeladen?

Nein. Die gesamte Konvertierung läuft lokal in deinem Browser mit JavaScript — nichts wird an einen Server gesendet und keine Farbwerte werden hochgeladen, sodass es privat und sogar offline funktioniert, sobald die Seite geladen ist.