RGB zu HEX

Ziehe RGB-Regler und erhalte HEX, HSL, HSV und CMYK live

100 % kostenlos. Läuft vollständig in deinem Browser: deine Dateien und Daten verlassen dein Gerät nie, und es wird nichts auf einen Server hochgeladen.

tuneRGB Channels

paletteHSL Channels

189°
95%
43%

visibilityLive Preview

#06b6d4

data_objectAll Formats

Jump to the next useful tool without leaving your flow.

See more

Über dieses Tool

Ziehe die RGB-Regler und sieh den HEX-Code live aktualisieren. Jedes Format bleibt synchron – ändere RGB, HSL oder Alpha und der Rest folgt sofort. Füge einen Wert in beliebiger Notation ein, um die andere Richtung zu konvertieren, kopiere den exakten String, den CSS erwartet, und behalte den Alpha-Kanal im Blick, damit eine Farbe aus einer Design-Datei den Weg in den Code überlebt. Nützlich, wenn eine Markenfarbe als RGB ankommt, dein Stylesheet, deine Design-Token-Datei oder dein E-Mail-Template aber HEX will.

So verwendest du dieses Tool

  1. RGB-Regler anpassenSetze Rot-, Grün- und Blaukanal, bis die Vorschau zu deiner Zielfarbe passt.
  2. In HSL feinabstimmenPasse Farbton/Sättigung/Helligkeit für sauberere Schatten- und Tonkontrolle an.
  3. Alpha-Transparenz setzenNutze den Deckkraftregler, um 8-stelliges HEX oder RGBA zu erzeugen, je nach Bedarf.
  4. Das Format kopieren, das du brauchstExportiere HEX, RGB, HSL, HSV oder CMYK für Design- oder Entwicklungs-Workflows.

RGB in HEX umrechnen

Wandle jeden Kanal (0 bis 255) in zwei Hexziffern um und hänge sie aneinander: rgb(255, 136, 0) ergibt FF, 88, 00, also #FF8800. Für einen Kanal teilst du durch 16: Das ganzzahlige Ergebnis ist die erste Ziffer, der Rest die zweite – 136 / 16 = 8 Rest 8, also 88.

Mit Transparenz kommt der Alphakanal als viertes Paar hinzu: 50 % Alpha sind etwa 80 in Hex, das ergibt #FF880080.

Warum es nutzen

  • Konvertiert und zeigt mehrere Farbformate in Echtzeit.
  • Macht Farbabstimmung visuell statt manuelles Zahlenraten.
  • Nützlich für Designer und Entwickler, die mit Markenpaletten arbeiten.
  • Enthält einen Transparenz-Workflow für modernes UI-Styling.

Häufige Anwendungen

  • Farben aus Design-Mockups an CSS-Variablen anpassen.
  • Hover-/Active-/Disabled-Schattenvarianten schnell erzeugen.
  • Teilbare Links für Team-Farbzusammenarbeit erzeugen.
  • Palettenwerte für Design-System-Tokens vorbereiten.

Tipps für bessere Ergebnisse

  • Nutze HSL-Steuerung, wenn du Hell-/Dunkelvarianten systematisch baust.
  • Prüfe das Kontrastverhältnis, bevor du eine Farbe für Textinhalt nutzt.
  • Halte eine gespeicherte Palette genehmigter Markenfarben für Konsistenz.
  • Nutze 8-stelliges HEX nur, wo Zielplattformen es unterstützen.

Fehler, die du vermeiden solltest

  • Zufällige Kanäle tweaken, ohne die Gesamtfarbton-Konsistenz zu prüfen.
  • Kontrastarme Farbpaare für Fließtext nutzen.
  • Zu viele Formatkonventionen in einer Codebasis mischen.
  • Vergessen, dass sich Transparenzverhalten über geschichtete Hintergründe unterscheidet.

Häufig gestellte Fragen

Sie passen zu unterschiedlichen Aufgaben. RGB ist, wie Bildschirme Farbe wirklich mischen, deshalb richtig, um einen exakten Wert zu treffen. HSL passt dazu, wie Menschen über Farbe denken – einen Farbton wählen, dann einstellen, wie kräftig und wie hell er ist – und ist deshalb viel besser, um einen Schatten per Auge zu erzeugen.

Er setzt die Deckkraft von 0 (vollständig transparent) bis 1 (vollständig deckend). Wenn Alpha unter 1 liegt, wechselt die HEX-Ausgabe automatisch zur 8-stelligen Form, weil Standard-6-stelliges HEX keine Transparenz tragen kann.

Jede Spur zeigt, was dieser Kanal über seinen Bereich tun würde, während die anderen Kanäle stehen bleiben. Es ist eine echte Vorschau statt eines generischen Verlaufs, was das Wählen eines Werts viel schneller macht.

Ja – der Teilen-Button kopiert einen Link mit der darin kodierten Farbe. Diesen Link zu öffnen lädt das Tool mit derselben bereits ausgewählten Farbe.

Nutz die Pipette in einem Bildeditor oder den Farbwähler in den Browser-DevTools und gib die R-, G- und B-Werte hier ein, um den HEX-Wert zu erhalten. Unter Windows enthält auch PowerToys eine Bildschirm-Farbpipette.

Jeder Kanal wird in einem Byte gespeichert, das 256 Werte (0-255) fasst. Das ergibt 256 x 256 x 256, also rund 16,7 Millionen Farben in normalem 8-Bit-Farbraum.

Wechsle zu den HSL-Reglern und ändere nur die Helligkeit - der Farbton bleibt gleich, der Ton gehört also zur selben Farbfamilie. RGB-Werte herunterzuskalieren macht ebenfalls dunkler, kann den Farbton aber leicht verschieben.

Related guides