HEX in RGB umrechnen
Verwandle jeden #Hex-Code sofort in seine RGB-Werte — mit Live-Farbvorschau.
Brauchst du das Gegenteil? RGB in HEX umrechnen
Dieser Konverter rechnet HEX in RGB um: Gib einen Hex-Farbcode ein, etwa #1a73e8 oder die Kurzform #f60, und du bekommst die passenden RGB-Werte im selben Moment. Ein Live-Swatch zeigt die tatsächliche Farbe, damit du prüfen kannst, ob du den richtigen Code erwischt hast, bevor er ins Stylesheet wandert.
Der Klassiker für diese Richtung ist CSS. Du hast einen Hex-Code aus einem Brand-Guide oder einem bestehenden Stylesheet, brauchst aber rgb()- oder rgba()-Syntax — meist wegen Transparenz: rgba(26, 115, 232, 0.5) braucht die drei RGB-Zahlen, die in #1a73e8 stecken. Auch Canvas-APIs, manche JavaScript-Libraries und ältere E-Mail-Clients wollen Farben als getrennte Rot-, Grün- und Blau-Kanäle.
Die Umrechnung läuft lokal in deinem Browser und aktualisiert sich beim Tippen. Nichts wird an einen Server geschickt, nichts muss installiert werden, und sowohl 3-stellige als auch 6-stellige Hex-Codes funktionieren — mit oder ohne führendes #.
So rechnest du HEX in RGB um
- Tippe oder füge einen Hex-Code ein, zum Beispiel #ff6600 oder einfach f60.
- Die RGB-Werte erscheinen sofort, daneben ein Vorschau-Swatch der Farbe.
- Prüfe, ob der Swatch der erwarteten Farbe entspricht.
- Kopiere den rgb()-String mit dem Copy-Button — fertig fürs CSS.
- Brauchst du die Gegenrichtung? Nutze den verlinkten RGB-in-HEX-Konverter.
Was dieser HEX-in-RGB-Konverter macht
Das Tool liest einen Hex-Farbcode und gibt dieselbe Farbe als drei dezimale Kanäle zurück: Rot, Grün und Blau, jeweils von 0 bis 255. Du bekommst die rohen Zahlen plus einen fertigen rgb()-String zum Einfügen und einen Live-Swatch — kein Kopfrechnen und kein Griff zum Taschenrechner, um herauszufinden, was ff oder 66 im Dezimalsystem bedeutet.
Es ist bewusst schmal gehalten. Es erledigt eine Aufgabe, Hex in RGB umzurechnen, und das in dem Moment, in dem du tippst, vollständig in deinem Browser. Dieser Fokus ist auch der Grund, warum es die sperrigen Varianten meistert, die dir in echten Dateien tatsächlich begegnen: 3-stellige Kurzform, ein optionales führendes #, Groß- oder Kleinschreibung und 8-stellige Codes mit Alpha-Kanal.
So funktioniert die Mathematik dahinter
Ein Hex-Code besteht aus drei Paaren hexadezimaler Ziffern: Rot, Grün, Blau. Jedes Paar entspricht einer Dezimalzahl von 0 bis 255. #ff6600 zerfällt also in ff, 66 und 00 — das sind 255, 102 und 0, also rgb(255, 102, 0). Kurzcodes verdoppeln zuerst jede Ziffer: #f60 wird zu #ff6600.
Hex und RGB beschreiben exakt dieselbe Farbe im selben sRGB-Farbraum — die Umrechnung ist in beide Richtungen verlustfrei. Welche Schreibweise du nimmst, hängt allein davon ab, was die Syntax drumherum erwartet.
Wann du RGB wirklich brauchst
Der Alltagsauslöser ist Transparenz. Ein Hex-Code aus einem Brand-Guide gibt dir eine opake Farbe, aber sobald du sie mit 50 % willst, brauchst du die Kanäle: rgba(26, 115, 232, 0.5) oder die moderne Syntax rgb(26 115 232 / 50%), die beide die drei Zahlen wollen, die in #1a73e8 stecken. Zuerst umzurechnen ist schneller und weniger fehleranfällig als Schätzen.
Über CSS hinaus erwarten die HTML-Canvas-API, viele Chart- und Animations-Libraries, SVG-Attribute und einige ältere E-Mail-Clients Farben als getrennte Rot-, Grün- und Blau-Werte. Wenn du eine Farbe an JavaScript übergibst, das dann einen einzelnen Kanal anpasst, ist RGB das Format, mit dem du tatsächlich rechnen kannst.
Der Alpha-Kanal und 8-stelliges Hex
Ein 8-stelliger Hex-Code fügt ein viertes Paar für die Deckkraft hinzu: #1a73e880. Die ersten sechs Ziffern werden wie gewohnt in RGB umgerechnet, und das letzte Paar bildet den Bereich 00 bis ff auf einen Alpha-Wert von 0 bis 1 ab. 80 in Hex ist also 128 in Dezimal, was etwa 0,5 Deckkraft entspricht, und ergibt rgba(26, 115, 232, 0.5).
Das ist relevant, weil Designer zunehmend 8-stellige Codes einfügen, die aus Figma oder Sketch exportiert wurden. Behandle Farbe und Transparenz als zwei getrennte Fakten: Das RGB-Triple ändert sich nie, wenn du die Deckkraft anpasst — nur das abschließende Alpha-Paar.
RGB und Farb-Barrierefreiheit
Web-Barrierefreiheitsrichtlinien legen Kontrastverhältnisse zwischen Text und seinem Hintergrund fest, und die Formeln dahinter arbeiten mit RGB-Kanalwerten, nicht mit dem Hex-String. Deinen Hex-Code in RGB umzurechnen ist der erste Schritt, um zu prüfen, ob etwa der Text #767676 auf weißem Hintergrund die Schwelle von 4,5:1 für normalen Fließtext schafft.
Weil die Umrechnung exakt ist, kannst du die hier gewonnenen RGB-Zahlen direkt in einen Kontrast-Checker oder in Code fallen lassen, der die relative Leuchtdichte berechnet. Ist eine Farbe grenzwertig, ist ein Kanal in RGB leicht zu verschieben und zurückzurechnen — ein einfacher Weg, eine konforme Fast-Übereinstimmung zu finden, ohne den Markenton aufzugeben.
Häufige Fehler, die du vermeiden solltest
Der übliche Ausrutscher ist ein fehlerhafter Code: ein 4- oder 5-Zeichen-String, ein verirrtes Leerzeichen oder ein #, das stehen blieb, obwohl ein Tool die nackten Ziffern wollte. Gültiges Hex hat 3, 6 oder 8 Hex-Zeichen; alles andere ist entweder eine Kurzform zum Expandieren oder schlicht ungültig. Dieser Konverter ist tolerant bei Groß-/Kleinschreibung und dem führenden #, aber die zugrunde liegende Farbe muss trotzdem wohlgeformt sein.
Die andere Falle ist die Annahme, Hex sei irgendwie minderwertiger als RGB oder umgekehrt. Es sind identische sRGB-Farben, nur in zwei Schreibweisen. Sieht eine umgerechnete Farbe falsch aus, liegt das fast immer daran, dass der Quellcode falsch war, nicht daran, dass die Umrechnung einen Fehler eingebracht hätte.
Verwandte Farb-Tools
Die Gegenrichtung ist genauso häufig, kombiniere das also mit dem RGB-in-HEX-Konverter, wenn dir eine Design-App oder Pipette schlichte Kanalzahlen liefert, die du als kompaktes Hex-Token brauchst. Beide sind exakt und beide laufen lokal.
Wenn du noch eine Farbe auswählst, statt eine feste umzurechnen, lässt dich der Color Picker zu einem Ton ziehen und HEX, RGB und HSL auf einmal ablesen, und der CSS-Gradient-Generator baut aus den gefundenen Farben kopierfertige lineare und radiale Hintergründe.
Häufig gestellte Fragen
Ist dieser HEX-in-RGB-Konverter kostenlos?
Ja, kostenlos und unbegrenzt. Keine Anmeldung, und die Umrechnung läuft im Browser, ohne dass Daten irgendwohin gesendet werden.
Warum sollte ich in CSS RGB statt Hex brauchen?
Meistens wegen Transparenz. rgba() und die moderne Syntax rgb(r g b / alpha) brauchen die einzelnen Kanalwerte. Hex hat zwar eine Alpha-Form (#RRGGBBAA), aber rgba() ist verbreiteter und leichter zu lesen.
Funktionieren 3-stellige Hex-Codes wie #f60?
Ja. Kurzcodes werden durch Verdoppeln jeder Ziffer expandiert — #f60 wird wie #ff6600 behandelt, genau so, wie es Browser tun.
Verändert die Umrechnung von Hex nach RGB die Farbe?
Nein. Hex und RGB sind zwei Schreibweisen für dieselben sRGB-Werte — die Umrechnung ist exakt, ohne Rundung und ohne Farbverschiebung.
Was ist mit 8-stelligen Hex-Codes mit Alpha?
Ein 8-stelliger Code wie #1a73e880 trägt ein viertes Paar für die Deckkraft. Die ersten sechs Ziffern werden normal in RGB umgerechnet; das letzte Paar bildet 00-ff auf einen Alpha-Wert von 0 bis 1 ab — du erhältst einen rgba()-Wert.
Läuft das auch mobil?
Ja. Der Konverter ist eine schlanke Seite, die in jedem Handy-Browser funktioniert — praktisch, wenn du unterwegs Hex-Codes aus einem Styleguide abliest.