Zum Inhalt springen
KlarTools
Menü
FinanzenTextEntwicklerAlltagZahlungGeneratorenEinheitenUnterstützen

Farbcode-Umrechner

Tippen Sie einen Hex-Wert oder stellen Sie RGB, HSL oder CMYK ein. Die übrigen Notationen und die Vorschau folgen sofort. Kontrastverhältnisse gegen Weiß und Schwarz zeigen, ob AA/AAA für Text näherungsweise reicht. CMYK ist keine Druckerei-Simulation.

3 oder 6 Stellen, mit oder ohne #

CMYK ist eine unkalibrierte sRGB-Näherung, kein Druckprofil.

Auf Weiß

Kontrast 4,7 : 1

  • AA Fließtext: bestanden
  • AA groß: bestanden
  • AAA Fließtext: nicht bestanden
  • AAA groß: bestanden

Auf Schwarz

Kontrast 4,5 : 1

  • AA Fließtext: nicht bestanden
  • AA groß: bestanden
  • AAA Fließtext: nicht bestanden
  • AAA groß: nicht bestanden

Worum geht es?

Farbnotationen beschreiben dieselbe sRGB-Farbe in anderer Schreibweise: HEX in CSS, RGB als Kanäle, HSL als Ton/Sättigung/Helligkeit. Wer „hex zu rgb“ sucht, will meist den Wert in den Clipboard fürs Stylesheet — ohne eine Bilddatei hochzuladen.

CMYK in diesem Tool ist unkalibriert (kein ICC-Profil, kein Papierweiß). Für Druckerei-PDFs brauchen Sie das Profil der Druckerei, nicht diese Schulformel. Der Kontrast gegen Weiß und Schwarz folgt WCAG 2 (relative Luminanz).

Kein Farbname-Lexikon (kein „rebeccapurple“), kein 8-stelliges HEX mit Alpha in diesem Stand. JSON und UUID daneben sind andere Entwickler-Helfer.

Formel

  • RGB 0–255 aus HEX-Paaren
  • HSL aus sRGB nach gängiger CSS-Umrechnung
  • Kontrast = (L1 + 0,05) / (L2 + 0,05) (WCAG 2, relative Luminanz)

Beispielrechnung

#ff0000

Eingabe
HEX ff0000 oder #ff0000
Rechenweg
  1. R=255, G=0, B=0
  2. rgb(255, 0, 0)
Ergebnis
reines Rot in RGB; HSL-Ton 0°

Kurzhex #0af

Eingabe
#0af
Rechenweg
  1. Expandieren zu #00aaff
  2. RGB 0, 170, 255
Ergebnis
dieselbe Farbe wie sechsstelliges HEX

Gut zu wissen

  • WCAG-AA für normalen Text: Kontrast mindestens 4,5:1; groß 3:1. AAA: 7:1 bzw. 4,5:1.
  • CMYK hier ohne Profil — nicht druckverbindlich.
  • Nur 3- oder 6-stellige Hex-Ziffern.
  • Kontrast nur gegen reines Weiß und reines Schwarz, nicht gegen Ihre Hintergrundfarbe.

So funktioniert der Rechner

  1. 1. HEX

    Erlaubt sind #rgb und #rrggbb, mit oder ohne Raute. Andere Zeichenketten gelten als ungültig.

  2. 2. HSL und CMYK

    HSL folgt der gängigen CSS-Umrechnung aus sRGB. CMYK ist unkalibriert (kein ICC-Profil) und nur zur groben Orientierung.

  3. 3. WCAG-Kontrast

    Relative Luminanz nach WCAG 2. Kontrast = (L1 + 0,05) / (L2 + 0,05). Schwellen: AA 4,5 (normal) / 3 (groß), AAA 7 / 4,5.

Häufige Fragen

Warum wird mein Hex abgelehnt?

Nur 3 oder 6 Hex-Ziffern, mit oder ohne Raute. Keine 8-stelligen Werte mit Alpha in diesem Stand, keine CSS-Namen wie „rebeccapurple“. Korrigieren Sie die Schreibweise und die übrigen Felder folgen.

Kann ich den Wert in CSS einfügen?

Ja. Kopieren Sie HEX, rgb() oder hsl(). Die Funktions-Schreibweise entspricht CSS Color. Ob Ihr Build-Tool sie minifiziert, ist eine andere Frage.

Ist CMYK drucktauglich?

Nein. Ohne Profil und Papierweiß ist das eine Schulformel. Für Druck brauchen Sie das Profil der Druckerei und meist ein anderes Farbmanagement.

Was bedeutet der Kontrast-Wert?

Das Verhältnis nach WCAG 2 gegen Weiß bzw. Schwarz. AA/AAA-Schwellen sind Richtwerte für Textlesbarkeit, kein automatisches Barrierefreiheits-Zertifikat Ihrer ganzen Seite.

Wird die Farbe irgendwohin geschickt?

Nein. Die Umrechnung läuft im Tab. Es gibt keine Farb-Cloud und kein Upload. HEX, RGB und HSL bleiben auf Ihrem Gerät.

  • JSON formatieren — Pretty-Print oder Minify im Browser. Fehlerhinweis bei ungültigem JSON.
  • UUID-Generator — UUID Version 7 (Standard) oder v4, lokal im Browser. Keine Geheimnisse.
  • QR-Code-Generator — URL, Text, WLAN, vCard, E-Mail und SMS — PNG und SVG, nur im Browser, ohne Konto.