Zum Inhalt springen
BrowserUtil

Farbkonverter

Farben zwischen HEX, RGB, HSL, HSV und CMYK umrechnen – mit WCAG-Kontrast und Farbpaletten.

#2563EB100% Transparenz
Deckkraft100%
RGB-Kanäle
R37
G99
B235
Voreingestellte Farben

Farbformate

HEX
#2563EB
HEXA (with Alpha)
#2563EBFF
RGB
rgb(37, 99, 235)
RGBA
rgba(37, 99, 235, 1)
HSL
hsl(221, 83%, 53%)
HSLA
hsla(221, 83%, 53%, 1)
HSV / HSB
hsv(221, 84%, 92%)
CMYK (Print)
cmyk(84%, 58%, 0%, 8%)

Farbabstufungen (Tints & Shades)

Helle Töne (Tints)
Dunkle Töne (Shades)

WCAG 2.1 Kontrastverhältnis

Kontrast zu Weiß (#FFFFFF)5.17:1
Franz jagt im komplett verwahrlosten Taxi quer durch Bayern
AA (≥4.5) ✓ Pass AAA (≥7.0) ✕ Fail
Kontrast zu Schwarz (#000000)4.06:1
Franz jagt im komplett verwahrlosten Taxi quer durch Bayern
AA (≥4.5) ✕ Fail AAA (≥7.0) ✕ Fail

Anleitung

  1. 1 Wählen Sie eine Farbe mit der Farbauswahl oder geben Sie HEX-, RGB-, HSL-Werte oder Farbnamen ein.
  2. 2 Passen Sie die Deckkraft oder die einzelnen RGB-Kanäle über Schieberegler an.
  3. 3 Kopieren Sie HEX-, RGB-, HSL-, HSV- oder CMYK-Formate mit einem Klick.
  4. 4 Prüfen Sie das WCAG 2.1-Kontrastverhältnis für Barrierefreiheit und erkunden Sie hellere und dunklere Töne.

Funktionen

  • Echtzeit-Umrechnung zwischen HEX, HEXA, RGB, RGBA, HSL, HSLA, HSV und CMYK
  • Farbauswahl mit Schachbrettmuster-Transparenzvorschau
  • Unterstützung standardisierter CSS-Farbnamen (z. B. crimson, steelblue)
  • WCAG 2.1 Kontrastprüfung mit AA- und AAA-Bewertungen für weiße und schwarze Hintergründe
  • 10-stufiger Palettengenerator für helle und dunkle Töne
  • Interaktive RGB-Kanalschieberegler
  • 100 % clientseitige Berechnung ohne Serveranfragen

Häufig gestellte Fragen

Worin unterscheiden sich RGB, HSL und HSV?

RGB basiert auf der Lichtintensität von Rot, Grün und Blau (Bildschirm-Modell). HSL (Farbton, Sättigung, Helligkeit) und HSV (Farbton, Sättigung, Dunkelstufe) orientieren sich an der menschlichen Farbwahrnehmung.

Was bedeuten die WCAG AA- und AAA-Bewertungen?

WCAG 2.1 verlangt für normalen Text ein Kontrastverhältnis von mindestens 4,5:1 (Stufe AA) und 7:1 (Stufe AAA). Für großen Text genügen 3:1 (AA).

Wird Alphatransparenz unterstützt?

Ja. Über den Transparenzregler oder 8-stellige HEXA- bzw. rgba()-Werte werden alle Formate synchron aktualisiert.

Ähnliche Werkzeuge