Neutralfarben sind Farben ohne oder mit nur sehr wenig Buntheit: Weiß, Grau und Schwarz sowie Grautöne mit einem leichten Stich ins Warme oder Kühle. Die CIE nennt Farben ohne Farbton unbunt und führt neutral als gängige Bezeichnung dafür an. In Oberflächen tragen Neutralfarben Hintergründe, Text und Linien.
- Neutralfarben
Farben ohne oder mit nur sehr wenig Buntheit, also Weiß, Grau und Schwarz sowie leicht getönte Grautöne.
Beispiel: „Die Website arbeitet mit Neutralfarben für Flächen und Text, die Markenfarbe bleibt Buttons und Links vorbehalten.“Auch: neutrale Farben, unbunte Farben, englisch neutrals.
Ein warmes Grau mit beigem Unterton heißt laut Dictionary.com Greige.
Neutralfarben und Chroma
Rein technisch hat eine Neutralfarbe ein Chroma von null: Im LAB-Farbraum liegen a und b bei null, nur die Helligkeit ändert sich. Laut CSS Color 4 verliert der Farbton dort jede Wirkung. In der Praxis zählen auch Grautöne mit einem Hauch Farbe zu den Neutralfarben.
Getönte Neutralfarben in Material Design
Googles Material Design nimmt für Hintergrund, Flächen und Text eine eigene Neutralpalette. Laut den Material Color Utilities ist sie im Standardschema kein reines Grau, sondern trägt den Farbton der Ausgangsfarbe mit einem Chroma von 6. Nur die Variante Monochrome setzt Chroma 0. So wirken Grautöne zur Marke passend, ohne bunt zu werden.
Neutralfarben und Kontrast
Weil Neutralfarben vor allem Text tragen, entscheidet ihr Kontrast über die Lesbarkeit. Die WCAG verlangen für normalen Text ein Kontrastverhältnis von mindestens 4,5 zu 1. Ein Grau wie #767676 auf Weiß liegt knapp darüber; hellere Grautöne für Fließtext fallen durch. Im Dark Mode kehrt sich die Rolle um, dann tragen dunkle Neutralfarben die Flächen.
:root {
--flaeche: oklch(98% 0.005 250);
--text: oklch(25% 0.02 250);
--linie: oklch(85% 0.01 250);
}