FileFlipFarbwähler

Farbwähler

Farben zwischen HEX, RGB, HSL, CMYK wählen und umrechnen. Harmonien erzeugen, WCAG-Kontrast prüfen.

Vorschau

auf Weiß 3.7:1AA Failauf Schwarz 5.7:1AA Pass

Kontrast

#3b82f6
rgb(59, 130, 246)
rgba(59, 130, 246, 1)
hsl(217, 91%, 60%)
hsla(217, 91%, 60%, 1)
cmyk(76%, 47%, 0%, 4%)
--color-primary: #3b82f6

Farbharmonien

Komplementär

Analog

Triadisch

Gespalten-komplementär

Tetradisch

Töne und Schatten

So geht's

  • Farbwähler klicken oder HEX-/RGB-/HSL-Wert eingeben
  • Alle Formate aktualisieren sich automatisch
  • Wert anklicken zum Kopieren

tools.colorPicker.editorialTitle

tools.colorPicker.editorialBody

Ähnliche Tools

Favicon generator
Bild zu Text (OCR)
Wörterzähler

Häufig gestellte Fragen

Was ist ein Farbwähler und wie funktioniert er?
Ein Farbwähler ermöglicht die Auswahl einer Farbe per Klick oder Eingabe und zeigt sie in verschiedenen Formaten (HEX, RGB, HSL, CMYK). Dieser synchronisiert alle Felder in Echtzeit und erlaubt das Kopieren von Formaten, Erzeugen von Harmonien und Prüfen des Kontrasts für Barrierefreiheit.
Was ist der Unterschied zwischen HEX, RGB und HSL?
HEX ist eine kompakte Schreibweise für RGB (z. B. #ff0000 für Rot). RGB nutzt drei Zahlen 0–255. HSL beschreibt Farbe durch Farbton (0–360), Sättigung und Helligkeit (0–100 %). Das Tool rechnet sofort zwischen allen um.
Was ist CMYK und wann wird es verwendet?
CMYK steht für Cyan, Magenta, Gelb und Schwarz (Key). Es wird vor allem im Druck verwendet. Das Tool zeigt den CMYK-Äquivalent jeder Farbe für ein einheitliches Erscheinungsbild in Web und Print.
Was ist das WCAG-Kontrastverhältnis?
WCAG definiert Mindestkontraste zwischen Text und Hintergrund. AA erfordert 4,5:1 für Fließtext, AAA 7:1. Das Tool zeigt das Verhältnis auf Weiß und Schwarz und ob AA oder AAA erfüllt sind.
Was sind Farbharmonien?
Farbharmonien sind Farbkombinationen, die gut zusammenpassen: komplementär, analog, triadisch, gespalten-komplementär, tetradisch. Das Tool erzeugt sie aus der gewählten Farbe. Klick auf eine Farbe setzt sie als Hauptfarbe.
Was sind Töne und Schatten?
Töne sind eine Farbe mit mehr Weiß, Schatten mit mehr Schwarz. Das Tool erzeugt neun Stufen von 10 % bis 90 %, ähnlich den Tailwind-CSS-Skalen.
Kann ich das für Webdesign und CSS nutzen?
Ja. Sie erhalten HEX, RGB, RGBA, HSL, HSLA und eine CSS-Variable. Jeden Wert können Sie in Ihr Stylesheet übernehmen. Der Kontrastcheck hilft bei der Wahl zugänglicher Textfarben.
Was ist eine CSS-Custom-Property (Variable) für Farben?
CSS Custom Properties erlauben, eine Farbe einmal zu definieren und wiederzuverwenden (z. B. --color-primary: #1a2b3c; dann var(--color-primary)). Das Tool zeigt die Variable für :root.