# Beige Farbverlauf: warme neutrale Codes mit ruhiger Wirkung

[Canonical HTML page](https://gradiently.design/de/guide/beige-gradient)

Beige trifft man leicht fast richtig und schwer ganz richtig. Der Trick: einen Unterton wählen, genug Spannweite für die Mischung lassen und dem Ganzen Textur geben.

## The short version

- Ein Beige Farbverlauf wirkt ruhig und hochwertig, wenn jeder Stopp denselben Unterton teilt: Rosa, Gelb oder Grau.
- Beige Verläufe brauchen eine größere Helligkeitsspanne, als man denkt, sonst verschwindet die Mischung und das Design wirkt flach.
- Helle Verläufe mit wenig Kontrast zeigen auf Bildschirmen leicht Banding, und eine feine Körnungsschicht ist die verlässlichste Lösung.
- Warme dunkle Brauntöne wie Espresso lesen sich auf Beige besser als reines Schwarz, und weiße Schrift funktioniert darauf selten.
- Sand Verläufe gehen von hellem Creme zu geröstetem Gold, so wie eine Düne auf ihrer Schattenseite dunkler wird.

Ein **Beige Farbverlauf** mischt warme Neutraltöne, Creme, Sand, Hafer und Leinen, von einem hellen Ton in einen etwas tieferen, alle mit demselben Unterton. Gut gemacht wirkt er ruhig, natürlich und leise hochwertig, weshalb Hautpflege, Interieur, Hochzeiten und Slow Fashion ihn lieben. Schlecht gemacht sieht er aus wie der Scan eines alten Briefumschlags. Der Unterschied liegt in drei Entscheidungen: ein Unterton, genug Spannweite und ein wenig Textur. Codes für jeden Look folgen.

## Wähle einen Unterton vor der Farbe

Jedes Beige neigt irgendwohin. Rosa Beigetöne wirken weich und hautnah. Gelbe Beigetöne wirken sonnig und sandig. Graue Beigetöne, oft Greige genannt, wirken architektonisch und kühl. Unterschiedliche Untertöne in einem Verlauf zu mischen ist der Hauptgrund, warum Beige schmutzig wirkt: Ein rosa Stopp neben einem grauen liest sich wie ein Fleck statt wie eine Mischung. Entscheide zuerst und bleib dann dabei.

- Leinen: #faf6ef
- Zartes Beige: #ecd3c6
- Rosensand: #d4ae9c
- Sand: #e8cfa8
- Honigdüne: #c9a273
- Greige: #ddd6cc
- Stein: #b9b0a3
- Espressotinte: #3b2a1e

Drei Unterton-Familien: Rosa im Paar Zartes Beige, Gelb im Sand-Paar, Grau in Greige und Stein. Leinen und Espresso passen zu allen dreien.

## Sand Farbverlauf Codes

Ein **Sand Farbverlauf** folgt einer Düne: hell und cremig auf der sonnigen Seite, tiefer und goldener auf der Schattenseite. Das sind die wärmsten Beigetöne hier und die nachsichtigsten, weil der gelbe Unterton sie vor Grau bewahrt.

- Sanddüne: `linear-gradient(160deg, #f6ead6 0%, #e8cfa8 50%, #c9a273 100%)`
- Wüstenmittag: `linear-gradient(180deg, #fbf3e6 0%, #efd9b4 60%, #d9b27c 100%)`
- Dünenschatten: `linear-gradient(135deg, #f2e2c9 0%, #d8b48a 45%, #a9805a 100%)`
- Nasser Sand: `radial-gradient(ellipse at 30% 20%, #f3e5cf 0%, #d6bb94 50%, #b08d66 100%)`

Vier Sand-Looks. Dünenschatten hat die größte Spanne und hält sich in kleinen Größen am besten; Wüstenmittag ist der hellste und verträgt überall dunkle Schrift.

## Leinen, Hafer und Stein Codes

Das sind die leiseren Beigetöne, näher an Creme und Greige. Sie sind hervorragende Hintergründe für Produktfotos und langes Lesen, denn sie halten sich zurück und lassen alles andere führen. Leinen ist am dezentesten, kaum ein Verlauf; Zartes Beige bringt den rosa Unterton; Stein ist am kühlsten, fast grau.

- Leinen: `linear-gradient(180deg, #faf6ef 0%, #f1e8da 100%)`
- Hafer-Latte: `linear-gradient(150deg, #f5ede1 0%, #e6d5bf 55%, #cdb59a 100%)`
- Zartes Beige: `linear-gradient(160deg, #f8ece6 0%, #ecd3c6 55%, #d4ae9c 100%)`
- Stein: `linear-gradient(160deg, #f2efea 0%, #ddd6cc 50%, #b9b0a3 100%)`

Weiche Neutraltöne. Wirkt ein Beige Farbverlauf auf deinem Bildschirm wie eine flache Farbe, ist die Spanne zu klein: Vertiefe den letzten Stopp.

Zur größeren Familie ruhiger Töne sieh dir [neutrale Farbpaletten](https://gradiently.design/de/guide/neutral-color-palettes) und [Erdtöne](https://gradiently.design/de/guide/earth-tone-colors) an. Willst du das tiefere Ende derselben Familie, Kaffee und Karamell, führen die Codes für den [braunen Farbverlauf](https://gradiently.design/de/guide/brown-gradient) dort weiter, wo diese enden.

## Warum Beige Verläufe Banding zeigen, und wie du es behebst

Helle Verläufe mit kleiner Spanne laufen nur durch eine Handvoll unterschiedlicher Farbwerte, deshalb zeichnet ein Bildschirm sie als sichtbare Stufen, und starke Kompression macht es schlimmer. Beige ist besonders anfällig. Eine feine Körnungsschicht bricht die Stufen auf und lässt Beige als Bonus wie Papier, Putz oder Stoff wirken statt wie eine Bildschirmfarbe. [Verlaufs-Banding](https://gradiently.design/de/guide/gradient-banding) erklärt die Ursache im Detail.

```css
.sand {
  position: relative;
  background: linear-gradient(160deg, #f6ead6 0%, #e8cfa8 50%, #c9a273 100%);
}

.sand::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.18;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
```

Ein Sand Farbverlauf mit einer darüber multiplizierten SVG-Rauschschicht. Erhöhe die Deckkraft für eine rauere, papierhaftere Oberfläche.

Weitere Körnungsrezepte und wie stark du gehen solltest, findest du unter [körnige Farbverläufe](https://gradiently.design/de/guide/grainy-gradients). Gradiently Marks tragen Körnung als Teil ihres Rezepts, ein beiger Mark kommt also mit bereits ausbalancierter Textur in jeder Größe.

## Schriftfarben, die zu Beige passen

| Tinte | Hex | Wirkung | Einsatz |
| --- | --- | --- | --- |
| Espresso | `#3b2a1e` | Warm und weich, dabei sehr gut lesbar | Überschriften und Fließtext auf jedem Beige |
| Anthrazit | `#2b2b2b` | Klar und modern | Stein- und Greige-Hintergründe |
| Tiefes Olive | `#3d4a2f` | Natürlich, ein wenig unerwartet | Sand- und Hafer-Hintergründe |
| Terrakotta | `#a4502f` | Warmer Akzent | Nur große Überschriften und Preise |
| Weiß | `#ffffff` | Schwach auf hellem Beige | Nur große Überschriften auf den tiefsten Stopps des Dünenschattens |

Schwarz funktioniert, aber Espressobraun hält das ganze Design in derselben warmen Familie.

## Beige, das ruhig wirkt, nicht langweilig

### Wirkt langweilig

- Rosa, gelbe und graue Beigetöne in einer Mischung
- Zwei Stopps so nah, dass die Mischung unsichtbar ist
- Eine saubere digitale Fläche mit sichtbaren Streifen
- Reinschwarze Schrift und ein unruhiges Layout
- Weißer Text auf hellem Sand

### Wirkt ruhig

- Ein Unterton über jeden Stopp
- Eine klare Spanne von Creme bis geröstetem Sand
- Eine feine Körnung, die wie Papier oder Putz wirkt
- Espresso-Schrift und großzügiger Raum
- Dunkle Tinte, mit einem Terrakotta-Akzent

Beige belohnt Zurückhaltung. Wenige Worte, viel Raum und ein starkes Produktfoto wirken hochwertiger als jede Menge Dekoration. Das ist der Look hinter den meisten guten [Designs für Hautpflegemarken](https://gradiently.design/de/guide/skincare-brand-design), und er trägt sich gut in Hochzeitspapeterie und Interieurstudios.

Ein Hochformat-Post auf warmem sandfarbenem Hintergrund mit den Worten Weniger, aber besser in dunkelbrauner Schrift

Ein Hautpflege-Launch-Post in einem Sand-Mark. Espresso-Schrift, eine Zeile, viel Luft.

## Wo ein Beige Farbverlauf seinen Platz verdient

Beige arbeitet am härtesten dort, wo es etwas anderes trägt: ein Produkt, ein Foto, ein paar sorgfältige Worte. Einige Orte, an denen es glänzt, mit den Größen zum Gestalten:

- **Produktfotos:** Ein Leinen- oder Hafer-Verlauf hinter einer Flasche oder einem Keramikstück, in 2048×2048 für ein Shopify-Produktbild, hält das Objekt als Star.
- **Hochzeitspapeterie:** Zartes Beige oder Sand für Einladungen in 5×7 Zoll (1500×2100 bei 300 dpi), mit Espresso- oder tiefer Olive-Schrift. Mehr Ideen unter [Hochzeits-Farbpaletten](https://gradiently.design/de/guide/wedding-color-palettes).
- **Interieur und Architektur:** Stein- und Greige-Verläufe für Portfolio-Cover und Projekt-Posts, bei denen die Fotografie die Farbe liefert. Siehe [Branding für Interior Designer](https://gradiently.design/de/guide/interior-designer-branding).
- **Website-Abschnitte:** Ein Leinen-Verlauf hinter einer Kundenstimme oder Preistabelle trennt sie ohne harte Linie von weißen Abschnitten.
- **Ein ruhiges Instagram-Raster:** Wechsle Sand-Posts mit Fotos ab, und der Feed liest sich als durchdachtes Ganzes.

Weil Beige so dezent ist, kann derselbe Verlauf auf einer Story richtig und auf einem breiten Banner ausgewaschen wirken. Rendere ihn für jedes Format, statt eine Datei zu strecken, und prüfe den hellsten Stopp auf einem Handy bei voller Helligkeit, wo helles Beige Richtung reines Weiß driften kann.

## FAQ

### Welche Farben ergeben einen Beige Farbverlauf?

Creme-, Sand-, Hafer- und Leinentöne mit demselben Unterton, zum Beispiel #f6ead6 zu #e8cfa8 zu #c9a273 für einen warmen Sand Farbverlauf.

### Warum sieht mein Beige Farbverlauf schmutzig aus?

Meist mischt er Untertöne, etwa ein rosa Beige neben einem grauen. Halte jeden Stopp in derselben Familie.

### Welche Schriftfarbe passt auf einen beigen Hintergrund?

Ein warmes dunkles Braun wie Espresso #3b2a1e liest sich klar und wirkt weicher als Schwarz. Anthrazit passt zu den kühleren Greige-Tönen.

### Wie verhindere ich Banding bei einem hellen Verlauf?

Vergrößere die Spanne zwischen dem ersten und letzten Stopp, lege eine feine Körnungsschicht über den Verlauf und exportiere als PNG statt als komprimiertes JPEG.
