Online-Farbwähler und Farbcode-Konverter

Wofür dieses Tool geeignet ist

Mit diesem Online-Farbwähler können Sie eine Farbe aufnehmen und ihre Werte in Formaten wie Hex, RGB, HSL, HWB, LCH, Device-CMYK und standardisierten CSS-Farbnamen prüfen. Sie können auch einen unterstützten Farbwert manuell eingeben und ihn automatisch umwandeln lassen.

Das ist nützlich für Frontend-Entwicklung, UI-Design, Farbauswahl aus Screenshots, die Prüfung von Markenfarben und die Vorbereitung von CSS-Farbwerten. Wenn Sie eine Farbe sehen, aber ihren Code nicht kennen, oder einen vorhandenen Wert in eine andere CSS-Schreibweise umwandeln müssen, erledigen Sie den Ablauf direkt auf dieser Seite.

Typische Anwendungsfälle

• Eine Pixelfarbe aus einer Webseite, einem Screenshot, einem Design-Mockup, einer Desktop-Anwendung oder der Systemoberfläche aufnehmen.
• Eine Farbe in frontendfreundliche Formate wie Hex, RGB, HSL, HWB, LCH oder CMYK umwandeln.
• CSS-Farbnamen nachschlagen, wenn Dokumentation, Designnotizen oder Code-Kommentare eine gut lesbare Bezeichnung benötigen.
• Prüfen, ob ein vorhandener Farbwert vom Browser ausgewertet werden kann, und das benötigte Ausgabeformat kopieren.

Möglichkeiten zur Farbauswahl

Es gibt zwei Möglichkeiten, eine Farbe auszuwählen: Nutzen Sie das integrierte Farbfeld oder klicken Sie auf die Pipetten-Schaltfläche, wenn Ihr Browser die EyeDropper-API unterstützt. Die Pipette kann auch Pixel außerhalb dieser Seite aufnehmen. Das ist praktisch, wenn Sie eine Farbe aus einem anderen Tab, einer Desktop-Anwendung oder einem Design-Mockup übernehmen möchten.

1. Öffnen Sie das Farbfeld im Browser und wählen Sie eine Farbe im Systemdialog aus.
2. Oder klicken Sie auf die Pipetten-Schaltfläche und nehmen Sie eine Farbe vom Bildschirm auf, wenn der Browser dies erlaubt.
3. Sie können auch einen Farbcode oder Farbnamen in das manuelle Eingabefeld einfügen und von der Seite auswerten lassen.
4. Kopieren Sie das benötigte Format für CSS, Designnotizen oder Konfigurationsdateien.

Unterstützte Konvertierungen

Der Konverter unterstützt die CSS-Farbformate Hex, RGB, HSL, HWB, LCH und Device-CMYK und akzeptiert auch die standardisierten englischen Farbnamen als Eingabe.

• Typische Eingaben sind #00bfff, rgb(0, 191, 255), hsl(195, 100%, 50%), hwb(195 0% 0%), lch(...) und CSS-Farbnamen.
• Die Ergebnisliste zeigt mehrere Formate gleichzeitig, sodass Sie leichter zwischen Codebasen, Designwerkzeugen und Dokumentationsvorgaben wechseln können.
• Die Ausgabe als Farbname ist, sofern verfügbar, der nächstliegende standardisierte CSS-Farbname. Verstehen Sie ihn als praktische Bezeichnung, nicht immer als exaktes Design-Token.

Worauf Sie achten sollten

• Die Pipette hängt von der Unterstützung der EyeDropper-API im Browser ab. Ist sie nicht verfügbar, funktionieren Farbeingabe und manuelle Eingabe weiterhin.
• Die Bildschirmaufnahme liefert normalerweise einen sRGB-Hexwert. Anzeigeprofile, Skalierung, Browser-Rendering, Kompression, Transparenz und Kantenglättung können kleine Abweichungen von einer Designdatei verursachen.
• Die nativen Farbwähler der Browser sehen je nach Betriebssystem und Browser unterschiedlich aus, die umgewandelten Werte auf der Seite verwenden jedoch denselben Auswertungsablauf.
• Wenn Ihre Eingabe einen Alphakanal enthält, prüfen Sie das Ausgabeformat, bevor Sie es in einem Zielsystem verwenden, das Transparenz beibehalten muss.

FAQ