Farbkonverter
Geben Sie eine Farbe in einem beliebigen Format ein und sehen Sie sofort alle Konvertierungen — RGB, Hex, HSL, HWB, CMYK und NCol.
Was ist ein Farbkonverter?
Ein Farbkonverter übersetzt eine Farbe zwischen den verschiedenen Kodierungssystemen, die im Webdesign, Druck und in der digitalen Kunst verwendet werden. In der Schweiz spiegelt die Designtradition die vier Sprachkulturen wider: die minimalistischen Rot-Weiss-Paletten des Schweizer Grafikstils, die warmen Erdtöne der Tessiner Architektur und das kräftige Rot des Schweizerkreuzes.
Das Werkzeug unterstützt sechs Formate: RGB, Hex, HSL, HWB, CMYK und Naturfarbe (NCol). Es erkennt ausserdem automatisch den nächstgelegenen CSS-Farbnamen.
Farbmodelle im Überblick
RGB
Additives Modell für Bildschirme. Jeder Kanal reicht von 0 bis 255. Alle drei auf Maximum ergeben Weiss.
Hex
Hexadezimale Kodierung von RGB, weit verbreitet in CSS. Beispiel: #ff0000 (Rot des Schweizerkreuzes).
HSL
Beschreibt Farbe durch Farbton (0–360°), Sättigung und Helligkeit. Intuitiv für die menschliche Wahrnehmung.
HWB
Alternative zu HSL mit Farbton, Weiss- und Schwarzanteil. Ideal zum Aufhellen oder Abdunkeln.
CMYK
Subtraktives Modell für den Druck: Cyan, Magenta, Gelb und Schwarz.
Naturfarbe (NCol)
W3C Natural Color: Farbton als Buchstabe + Prozent-Offset, Weiss- und Schwarzanteil.
Schweizer Farbbeispiele
Schweizer Rot (#ff0000)
Das leuchtende Rot des Schweizerkreuzes und der Eidgenossenschaft (RGB 255, 0, 0). Reines Primärrot bei HSL 0°, 100%, 50%. Symbol schweizerischer Souveränität und des Roten Kreuzes.
Alpenweiss (#ffffff)
Das reine Weiss des Schweizerkreuzes auf rotem Grund (RGB 255, 255, 255). In der Schweizer Grafikschule steht Weiss für Klarheit, Raum und typografische Präzision.
Helvetica-Grau (#4a4a4a)
Das charakteristische Dunkelgrau der Helvetica, der weltweit verbreitetsten Schriftfamilie aus der Schweiz (RGB 74, 74, 74). In HSL 0°, 0%, 29%. Ikone des International Typographic Style.
Bernerocker Goldbraun (#8b6914)
Das Warmgold der Berner Sandsteinfassaden (RGB 139, 105, 20). In HSL 43°, 75%, 31%. Prägend für die Altstadt von Bern, UNESCO-Weltkulturerbe seit 1983.
So funktioniert es
- 1
Wählen Sie das Eingabeformat, das Ihrem Farbcode entspricht.
- 2
Geben Sie die Farbwerte ein. Die Ergebnisse werden sofort aktualisiert — kein Button nötig.
- 3
Der Konverter normalisiert alle Eingaben auf eine interne RGB-Darstellung als universellen Pivot.
- 4
Aus dem RGB-Tripel werden alle anderen Formate mit standardisierten mathematischen Formeln berechnet.
- 5
Die Namenssuche vergleicht mit 148 CSS-Standardfarben und gibt den nächstgelegenen Treffer zurück.
Tipps und Best Practices
- ✓
Nutzen Sie Hex oder RGB für CSS-Stylesheets; bevorzugen Sie HSL zur programmatischen Helligkeitsanpassung.
- ✓
CMYK-Werte sind Näherungswerte — fordern Sie für kommerziellen Druck immer einen Andruckbogen an.
- ✓
HWB eignet sich ideal für Farbfamilien: Farbton konstant halten, Weissanteil variieren.
- ✓
Das '#'-Präfix bei Hex-Codes ist optional.
- ✓
Für offizielle Schweizer Bundesfarben (EDA, SBB, Post) immer die offizielle CI-Dokumentation heranziehen.
Häufige Fragen
Was ist der Unterschied zwischen HSL und HWB?
Beide nutzen einen Farbtonwinkel, aber die zweiten und dritten Parameter unterscheiden sich. HSL verwendet Sättigung und Helligkeit; HWB verwendet Weiss- und Schwarzanteil direkt. HWB ist oft intuitiver zum Aufhellen (mehr Weiss) oder Abdunkeln (mehr Schwarz).
Warum sieht CMYK auf dem Bildschirm anders aus?
Bildschirme nutzen additives Licht (RGB); Drucker nutzen subtraktive Tinte (CMYK). Die Farbräume überlappen nicht. Der Konverter liefert eine mathematische Näherung, keinen pressefertigen Farbwert.
Was ist Naturfarbe (NCol)?
Ein W3C-Vorschlag, der den Farbton als Buchstabe (R, Y, G, C, B, M) plus Prozentversatz kodiert, gefolgt von Weiss- und Schwarzanteil. Beispiel: R0 0% 0% ist reines Rot.
Kann ich eine CSS-Farbe wie 'ivory' direkt eingeben?
Ja. Tippen Sie den Namen ins Feld 'Nach CSS-Name suchen' – der Konverter lädt die Werte automatisch.
Wie genau sind die Umrechnungen?
Hex und RGB sind verlustfrei (mit ganzzahliger Rundung). HSL, HWB, NCol werden auf eine Nachkommastelle gerundet. CMYK ist nur eine mathematische Näherung.
Warum wird manchmal kein Farbname angezeigt?
Es sind nur 148 CSS-Standardfarben enthalten. Liegt die Farbe mehr als ~30 RGB-Einheiten von jeder benannten Farbe entfernt, wird kein Name angezeigt.
Farbdarstellungen können zwischen Geräten aufgrund von Display-Kalibrierung und Farbprofilen variieren. CMYK-Werte sind mathematische Näherungswerte.