Farben zwischen allen Formaten konvertieren
HEX, RGB, HSL, CMYK, HSV und mehr. Farbwert eingeben und sofort alle Entsprechungen sehen. Farbpalätten erkunden und Wärmen prüfen.
Alle gängigen Formate
HEX, RGB, HSL, HSV, CMYK und mehr — sofort alle Entsprechungen sehen.
Farbpalette
Verwandte Farbtöne und Schattierungen erkunden.
Clipboard-freundlich
Jeden Wert mit einem Klick kopieren.
Vollständige Farbkonvertierung
Mehr als Formatkonvertierung.
HEX & RGB
Zwischen hexadezimalen und RGB-Werten konvertieren. Der Grundstein des Web-Designs.
HSL & HSV
Farbton, Sättigung und Helligkeit oder Wert anpassen. Intuitiver für menschliche Wahrnehmung.
CMYK
Druckfarbwerte in CMYK für professionellen Druck umrechnen.
Farbvorschau
Sofortige visuelle Vorschau der ausgewählten Farbe und verwandter Töne.
Wer nutzt das
Designer und Entwickler, die mit Farben arbeiten.
Webentwickler
Designvorgaben in Code umwandeln. HEX aus RGB, HSL für CSS-Animationen, CSS-Variablen für Theming. Kopierfertige Formate.
UI-Designer
Farbpaletten mit konsistenten Schattierungen erstellen. Textkontrast vor der Übergabe prüfen. Barrierefreiheit sicherstellen.
Markendesigner
Markenfarben zwischen Formaten für verschiedene Plattformen konvertieren. Abtönungen für Sekundärfarben und Hintergründe erzeugen.
Häufige Fragen
Über dieses Werkzeug
Warum es verschiedene Farbformate gibt
Verschiedene Farbformate dienen unterschiedlichen Zwecken. HEX-Codes sind kompakt und in der Webentwicklung weit verbreitet. RGB entspricht direkt der Art, wie Bildschirme Farben darstellen. HSL ist intuitiv für Designer, die in Farbton, Sättigung und Helligkeit denken.
HEX-Farben
Die HEX-Notation verwendet sechs hexadezimale Ziffern für Rot, Grün und Blau: #RRGGBB. Jedes Paar reicht von 00 (kein Anteil) bis FF (Maximum). #FF0000 ist reines Rot, #00FF00 ist Grün, #0000FF ist Blau.
Für wiederholte Ziffern gibt es eine Kurzform: #RGB wird zu #RRGGBB. So entspricht #F00 dem Wert #FF0000.
RGB-Farben
RGB gibt jeden Kanal als Wert von 0 bis 255 an. rgb(255, 0, 0) ist Rot. Dieses Format entspricht direkt der Funktionsweise von Monitoren — drei farbige Lichter mit unterschiedlicher Intensität.
RGBA fügt einen Alphawert für Transparenz hinzu: rgba(255, 0, 0, 0.5) ist Rot mit 50 % Transparenz.
HSL-Farben
HSL steht für Hue (Farbton), Saturation (Sättigung), Lightness (Helligkeit):
- Farbton: Position auf dem Farbkreis (0–360°). Rot ist 0°, Grün ist 120°, Blau ist 240°.
- Sättigung: Farbintensität (0–100 %). 0 % ist Grau, 100 % ist kräftig.
- Helligkeit: (0–100 %). 0 % ist Schwarz, 100 % ist Weiß, 50 % ist die reine Farbe.
HSL ist nützlich, wenn Variationen erstellt werden sollen — bei gleichem Farbton und veränderter Helligkeit entstehen natürliche Schattierungen und Abtönungen.
Barrierefreiheit und Kontrast
WCAG (Web Content Accessibility Guidelines) legt Mindest-Kontrastverhältnisse für lesbaren Text fest:
- AA Normaler Text: mindestens 4,5:1
- AA Großer Text: mindestens 3:1 (ab 18 px fett oder 24 px normal)
- AAA Normaler Text: mindestens 7:1
- AAA Großer Text: mindestens 4,5:1
Das Kontrastverhältnis vergleicht die Leuchtdichte zweier Farben. 1:1 bedeutet kein Kontrast (gleiche Farbe), 21:1 ist das Maximum (Schwarz auf Weiß).
Kontrastprüfung ist wichtig: Etwa 1 von 12 Männern und 1 von 200 Frauen haben eine Form von Farbsehschwäche. Niedriger Kontrast beeinträchtigt jeden bei hellem Sonnenlicht oder auf Displays geringer Qualität.