Farben: Namen, Codes und Abstufungen
Finden Sie Farben nach Name oder Code: HEX, RGB, HSL, OKLCH, hellere und dunklere Abstufungen, Komplementär- und passende Farben.
Klicken Sie auf eine Farbe, um ihre Details anzuzeigen.
Referenzfarben
Benannte Webfarben (CSS)
Diese Namen können direkt in CSS verwendet werden, zum Beispiel color: tomato;
Keine Farbe gefunden. Geben Sie einen Code wie #1245B4 ein, um ihn anzuzeigen.
Von KSPNAI erstellte Sammlungen, frei verwendbar.
Über dieses Tool
Diese kostenlose Online-Farbtabelle hilft Ihnen, eine Farbe nach Name oder Code zu finden. Sie vereint Referenzfarben mit gängigen Namen (Terrakotta, Salbeigrün, Petrolblau, Bordeauxrot…) und die benannten CSS-Farben wie tomato oder navy. Jede Farbe hat ein eigenes Datenblatt mit HEX-, RGB-, HSL- und OKLCH-Codes, bereit zum Kopieren für Website, Dokument oder Layoutprogramm.
Das Datenblatt zeigt außerdem hellere und dunklere Abstufungen, die Komplementärfarbe, analoge Farben und eine Triade sowie einen Hinweis, ob heller oder dunkler Text darauf besser lesbar ist. Filtern Sie nach Farbfamilie (Rot, Blau, Braun…) oder geben Sie einen beliebigen HEX-Code ein, um sein Datenblatt zu sehen. Links öffnen die Farbe im Paletten-Generator, bei den Tailwind-Abstufungen oder im Kontrasttest.
- Suche nach Farbname oder HEX-Code
- HEX, RGB, HSL und OKLCH zum Kopieren
- Hellere und dunklere Abstufungen jeder Farbe
- Komplementär, analog und Triade
- Filter nach Farbfamilie
So funktioniert es
- Geben Sie einen Namen oder Code in die Suche ein oder wählen Sie eine Farbfamilie.
- Klicken Sie auf eine Farbe, um ihr Datenblatt anzuzeigen.
- Klicken Sie neben dem gewünschten HEX-, RGB-, HSL- oder OKLCH-Code auf Kopieren.
- Klicken Sie auf eine Abstufung oder passende Farbe, um deren Datenblatt zu öffnen.
Häufige Fragen
Welchen HEX-Code hat eine Farbe wie Salbeigrün oder Petrolblau?
Geben Sie den Namen in die Suche ein und klicken Sie darauf: Das Datenblatt zeigt den HEX-Code sowie die Werte in RGB, HSL und OKLCH. Die Werte entsprechen dem von KSPNAI gewählten Farbton; andere Farbtabellen können leicht abweichen.
Kann ich eine Farbe ansehen, die nicht in der Liste steht?
Ja. Geben Sie einen HEX-Code ein, etwa #1245B4: Passt keine Farbe der Liste, wird trotzdem das vollständige Datenblatt angezeigt.
Was bedeuten HSL und OKLCH?
Das sind weitere Schreibweisen für Farben in CSS. HSL beschreibt eine Farbe über Farbton, Sättigung und Helligkeit; OKLCH nutzt eine gleichmäßiger wahrgenommene Helligkeit, was beim Erstellen stimmiger Abstufungen hilft.
Ist das Tool kostenlos und bleiben meine Suchen privat?
Ja, es ist kostenlos und ohne Konto nutzbar. Die Farben sind Teil der Seite, und die Suche läuft in Ihrem Browser, ohne dass etwas übertragen wird.