Gedämpfte Farbpaletten: staubige Codes für ruhige Marken

Eine gedämpfte Farbpalette ist ein Set von Farben mit heruntergedrehter Sättigung, sodass sie staubig, weich und leicht grau statt rein aussehen. Typisch sind Salbei #9CAF88, Altrosa #C9A9A6, Schieferblau #6B7F99, Mauve #B48A9B und Ton #B5826B. Sie passen zu Marken, die ruhig und überlegt wirken wollen: Keramik, Wellness, Papeterie, Architektur, Slow Fashion. Der Haken ist, dass gedämpfte Farben zur selben Helligkeit driften, deshalb enthält jede gute gedämpfte Palette ein festes Dunkel, das sie zusammenhält.

Was eine Farbe gedämpft macht

Eine Farbe hat drei Regler: Farbton, Sättigung und Helligkeit (siehe Farbton, Sättigung und Helligkeit). Das Dämpfen senkt die Sättigung, während der Farbton erkennbar bleibt. Dafür gibt es zwei klassische Wege: Grau beimischen, was Designer einen Ton nennen, oder etwas von der Komplementärfarbe beimischen, was Maler schon immer tun. Beide ziehen die Farbe Richtung Neutral.

Gedämpft ist nicht dasselbe wie Pastell. Ein Pastell fügt Weiß hinzu und bleibt deshalb klar und hell; eine gedämpfte Farbe fügt Grau hinzu und kann hell, mittel oder dunkel sein und wirkt immer ein wenig staubig. Pastell-Farbpaletten und Tints, Töne und Shades ziehen die Grenze genauer.

Sieben gedämpfte Farbpaletten mit Hex-Codes

• Hafen: Nebel #E6E9EA, Schieferblau #6B7F99, Meergrau #93A3A6, Tau #C2AD8E, tiefes Marine #22303C.
• Keramik: Biskuit #F1E8DD, Ton #B5826B, Aschenglasur #A7A39A, Eisen #5B4A42, Ofenschwarz #231D1A.
• Lavendelstaub: Dunst #F1EBE6, Mauve #B48A9B, Heidekraut #8E8AA6, Salbei #9CAF88, Aubergine #4A3F4F.
• Olivenhain: Creme #F2EDE1, Oliv #8A8A5C, getrocknete Kräuter #B1A87F, Terrakotta #A9674E, Rinde #3A3328.
• Nordisch: Schnee #F2F3F1, Birke #D8D1C4, Flechte #A3AE9D, Fjord #5F7A80, Kiefer #24302E.
• Staubige Dämmerung: Pergament #EFE6DA, Pfirsichstaub #D9A88F, Rosenbraun #A06F6B, Pflaumengrau #6E5866, Nacht #2A2329.

Jede dieser Paletten endet in einem Dunkel. Das ist keine Dekoration. Ohne es gibt es nichts, worin man Text setzen oder eine Kante ziehen könnte, und die Palette wirkt wie ein Foto, das in der Sonne lag.

Warum gedämpfte Paletten zu Nebel werden

Das Dämpfen nimmt die stärksten Unterschiede zwischen Farben weg, sodass die Helligkeit das Einzige bleibt, das sie trennt. Salbei #9CAF88 und Altrosa #C9A9A6 sehen nach einem hübschen Kontrast aus Grün und Rosa aus, ihr Kontrastverhältnis beträgt aber 1,09:1: fast dieselbe Helligkeit. Text in der einen auf der anderen ist unlesbar. Selbst Salbei auf reinem Weiß erreicht nur 2,36:1.

Prüfe deine eigenen Paare mit den Hinweisen unter Farbkontrast. Eine gute Gewohnheit ist, die Palette kurz in Graustufen umzuwandeln: Wenn zwei Farben zum selben Grau werden, setze nie eine auf die andere.

So dämpfst du jede Farbe in CSS

Wenn du schon eine leuchtende Markenfarbe hast und eine ruhigere Begleiterin willst, mische sie mit Grau, statt nach Augenmaß eine neue Farbe zu wählen. color-mix() im oklch-Raum hält den Farbton stabil, während die Sättigung fällt, und wird von allen aktuellen großen Browsern unterstützt.

:root {
  --brand: #2f6bff;

  /* the same hue, progressively muted */
  --brand-muted-1: color-mix(in oklch, var(--brand) 70%, #8c8c8c);
  --brand-muted-2: color-mix(in oklch, var(--brand) 45%, #8c8c8c);
  --brand-muted-3: color-mix(in oklch, var(--brand) 25%, #8c8c8c);

  /* or set chroma directly in oklch: low chroma reads as muted */
  --slate: oklch(0.58 0.05 255);
  --sage: oklch(0.72 0.06 130);
}

OKLCH erklärt behandelt, warum dieser Raum gleichmäßiger reagiert als HSL, und Sättigung im Design behandelt, wann du sie wieder aufdrehst.

Gedämpfte Verläufe und Hintergründe

Gedämpfte Farben ergeben weiche, leise Verläufe, besonders wenn die Stopps im Farbton nah beieinander liegen und das Licht von einer Seite kommt. Füge etwas Körnung hinzu: Kontrastarme Mischungen bekommen leicht Streifen, und Textur lässt sie wie eine Oberfläche statt wie eine Bildschirmeinstellung wirken.

Ein gedämpftes Schema verträgt auch eine etwas stärkere Farbe als Akzent, etwa ein Terrakotta unter Salbeitönen oder ein tieferes Petrol unter Grautönen. Beschränke sie auf ein einziges Element pro Design: einen Preis, einen Button, ein Datum. So findet das Auge einen Ruhepunkt, ohne die Ruhe zu brechen, und so funktionieren meist auch die Erdton-Paletten, bei denen sich gedämpfte Schemata bedienen.

Wenn deine Marke in gedämpften Farben lebt, leistet ein Hintergrund mit eigener Körnung und eigenem Licht viel von der Arbeit. Ein Gradiently Mark gibt dir eine weiche, eigene Oberfläche, die Text von selbst lesbar hält, was in einem gedämpften Schema wichtiger ist als in jedem anderen.