Finanzen & Steuern Datum & Uhrzeit Gesundheit & Lifestyle Mathematik Geometrie Höhere Mathematik Einheiten-Umrechner Energie & Haushalt Bau Entwickler-Tools Text-Werkzeuge Lifestyle-Umrechner Bild- & Datei-Tools

Farbcode-Umrechner

Geben Sie eine Farbe in jedem Format ein und sehen Sie sie sofort umgewandelt in HEX, RGB, HSL, HSV und CMYK — alle bidirektional synchronisiert.

Farbeingabe

Aktualisiert beim Tippen
Wählen oder einfügen
Beliebige Farbe ? —
Eingabemodus erzwingen (standardmäßig automatisch erkannt)
Kanäle anpassen
Farbraum ?
Rot0
0128255
Grün0
0128255
Blau0
0128255
Alpha ? 1.00
00.51
Palette (klicken Sie ein Farbfeld zum Laden)
Tints & Shades ?
Harmonien ?
Zuletzt

Beispiele

So funktioniert's

Jede digitale Farbe lässt sich durch mehrere mathematische Modelle beschreiben, die jeweils für unterschiedliche Workflows geeignet sind. HEX ist der Web-Standard — ein kompakter sechsstelliger String (#RRGGBB), bei dem jedes Paar einen der drei Lichtkanäle (Rot, Grün, Blau) als Wert von 00 bis FF zur Basis 16 codiert. Es ist im Wesentlichen eine Kurzform von RGB, das dieselben drei Kanäle als Dezimalzahlen von 0 bis 255 ausdrückt, was sie programmatisch leicht lesbar und veränderbar macht.

HSL (Hue, Saturation, Lightness) ordnet den Farbraum um ein 360°-Farbrad neu an. Der Farbton (Hue) wählt die Grundfarbe, die Sättigung steuert die Lebendigkeit und die Helligkeit bewegt sich zwischen Schwarz (0 %) und Weiß (100 %). Das macht HSL ideal für den Aufbau von Paletten: Halte den Farbton konstant und variiere Sättigung oder Helligkeit, um Tints, Shades und Tönungen zu erzeugen. HSV (Hue, Saturation, Value) ist ähnlich, definiert die Helligkeit aber anders — 100 % Value ist die hellste Version des Farbtons. Deshalb bevorzugen Grafikprogramme wie Photoshop dieses Modell für Farbwähler.

CMYK (Cyan, Magenta, Yellow, Key/Black) ist das subtraktive Modell für den Druck. Tinten absorbieren Licht, statt es zu emittieren, daher ist der CMYK-Farbumfang enger als der von RGB. Die mathematische Umrechnung zwischen beiden ist einfach, kann aber für druckgenaue Ergebnisse Farbprofil-Anpassungen erfordern. Dieses Tool wandelt alle Formate über RGB als Zwischenstufe um und zeigt eine Live-Vorschau, die Komplementärfarbe und die nächstgelegene benannte CSS-Farbe für jede Eingabe an.

Tipps & bewährte Praxis

Erstellen Sie Paletten mit HSL. Halten Sie den Farbton fest und passen Sie Sättigung (lebhaft → gedämpft) und Helligkeit (dunkel → hell) an, um harmonische Tints und Shades aus einer Grundfarbe zu erzeugen.
Prüfen Sie den Kontrast für Barrierefreiheit. WCAG 2.1 verlangt mindestens ein Kontrastverhältnis von 4,5:1 für normalen Text. Paaren Sie Ihre Vorder- und Hintergrundfarben in einem Kontrast-Checker, bevor Sie Ihr Design finalisieren.
Verwenden Sie Kurzform-HEX, wenn möglich. Wenn jedes Kanalpaar aus doppelten Ziffern besteht (#AABB00), können Sie #AB0 schreiben — das spart Bytes in CSS und hält die Stylesheets kompakt.
Konvertieren Sie vor dem Druck zu CMYK. RGB-Bildschirme können Neon- und elektrische Farbtöne anzeigen, die CMYK-Tinten nicht reproduzieren können. Sehen Sie sich Ihr Design immer im CMYK-Modus an, um stumpfe oder verschobene Farben auf Papier zu vermeiden.
Komplementärfarbe = Farbton + 180° in HSL. Wenn Ihre Farbe hsl(30, 80%, 50%) ist, ist ihr Komplement hsl(210, 80%, 50%). Diese einfache Regel liefert kontrastreiche Akzentpaare für jede Grundfarbe.

Verwandte Rechner

JSON-Formatter
Entwickler-Tools
Bildgrößen-Anpasser
Bild- & Datei-Tools
Längen-Umrechner
Einheiten-Umrechner
Wortzähler
Text-Werkzeuge

Häufig gestellte Fragen

Was ist ein HEX-Farbcode?

HEX ist eine 6-stellige hexadezimale Notation (#RRGGBB), die die Kanäle Rot, Grün und Blau darstellt. Jedes Paar reicht von 00 bis FF (0–255 dezimal). Beispielsweise ist #FF0000 reines Rot und #FFFFFF Weiß.

RGB stellt Farben durch Mischen von rotem, grünem und blauem Licht dar. Jeder Kanal hat einen Wert von 0 bis 255. Bei voller Intensität aller drei (255,255,255) entsteht Weiß, bei null (0,0,0) Schwarz.

Beide nutzen den Farbton (Hue, 0–360°) für die Position auf dem Farbrad. HSL nutzt Sättigung und Helligkeit (Lightness) — 50 % Helligkeit ist die reine Farbe. HSV nutzt Sättigung und Value (Helligkeit) — 100 % Value ist die hellste Version. HSL ist im Webdesign in der Regel intuitiver.

Komplementärfarben liegen sich auf dem Farbrad gegenüber, das heißt, sie sind 180° im Farbton entfernt. In HSL einfach 180 zum Farbtonwert addieren (mit Umlauf bei 360). Komplementärpaare erzeugen hohen Kontrast und visuelle Wirkung.

CMYK steht für Cyan, Magenta, Yellow und Key (Schwarz). Es ist ein subtraktives Farbmodell für den Druck. Beim Gestalten für physische Medien — Visitenkarten, Poster, Verpackungen — sollten Sie in CMYK arbeiten, um eine genaue Farbwiedergabe auf Papier zu gewährleisten.

Bildschirme nutzen additives RGB-Licht (Mischen von Lichtwellenlängen), während Drucker subtraktive CMYK-Tinte (Absorption von Licht) verwenden. RGB kann lebendige Neon- und elektrische Farbtöne darstellen, die CMYK physikalisch nicht reproduzieren kann, weshalb helle Bildschirmfarben im Druck oft gedämpft wirken.

WCAG 2.1 verlangt ein Kontrastverhältnis von mindestens 4,5:1 für normalen Text und 3:1 für großen Text. Wandle Vorder- und Hintergrundfarben in RGB um, berechne ihre relative Leuchtdichte und dann das Verhältnis. Viele Online-Tools automatisieren diese Prüfung.

CSS definiert 148 benannte Farben (wie „coral", „teal", „rebeccapurple"), die Sie direkt in Stylesheets statt HEX- oder RGB-Werten verwenden können. Benannte Farben sind leichter zu merken, bieten aber eine begrenzte Palette im Vergleich zu den vollen 16,7 Millionen Farben über HEX.

Teile den 6-stelligen HEX-Code in drei Paare und wandle jedes Paar von Basis 16 in Basis 10 um. Beispielsweise wird #2563EB zu 25₁₆ = 37, 63₁₆ = 99, EB₁₆ = 235, ergibt also RGB(37, 99, 235).

Eine Palette von 216 Farben, die auf frühen 8-Bit-Monitoren konsistent angezeigt wurde. Jeder RGB-Kanal nutzt einen von sechs Werten (00, 33, 66, 99, CC, FF). Auf modernen Displays sind sie weitgehend obsolet, werden aber in Legacy-Projekten noch referenziert.