# Retro kleurverlopen: van jaren 70 tot jaren 90

[Canonical HTML page](https://gradiently.design/nl/guide/retro-gradients)

Strepen in mosterd en roest, neon op zwart, teal met paars en het blauw van titelbalken. Drie decennia retro kleurverlopen met codes, en de kleine ingrepen die ze nieuw laten aanvoelen.

## The short version

- Een retro kleurverloop is een kleurverloop dat een bepaald decennium oproept, meestal de warme strepen van de jaren 70, het neon van de jaren 80 of het teal en paars van de jaren 90.
- Kleurverlopen uit de jaren 70 gebruiken mosterd, gebrand oranje, roest en chocoladebruin, vaak als strepen met harde randen op crème.
- Kleurverlopen uit de jaren 80 vallen uiteen in twee looks: neonroze en cyaan op zwart, en felle pastelpop in roze, teal, geel en lila.
- Kleurverlopen uit de jaren 90 omvatten verlopen van teal naar paars, diepe juweeltinten en het verloop van marine naar blauw uit oude titelbalken op de desktop.
- Om een retro kleurverloop te moderniseren verzacht je de randen van de strepen, verlaag je de verzadiging iets, meng je in OKLCH en voeg je fijne korrel toe.

Een **retro kleurverloop** is een kleurverloop dat meteen een decennium oproept. De jaren 70 hadden warme strepen in mosterd, oranje, roest en bruin. De jaren 80 hadden neonroze en cyaan op zwart, en felle pastelpop. De jaren 90 hadden teal en paars, diepe juweeltinten en de balken van marine naar blauw uit vroege desktopsoftware. Hieronder staan per decennium een palet en een set kopieerbare kleurverlopen, en daarna een methode om ze te moderniseren, zodat ze als een verwijzing voelen en niet als een verkleedpak.

Retro werkt omdat kleur herinnering draagt. Mensen herkennen een decennium aan het palet, lang voordat ze het lettertype of de layout opmerken, en dat maakt deze kleurverlopen tot een kortere weg naar een sfeer. Lees voor het langere verhaal over hoe kleurverlopen door design trokken de [geschiedenis van kleurverlopen](https://gradiently.design/nl/guide/history-of-gradients).

## Kleurverlopen uit de jaren 70: zonsondergangstrepen in oranje en bruin

Het palet van de jaren 70 is warm en aards: oogstgoud, gebrand oranje, roest en diep chocoladebruin, met avocadogroen als buitenbeentje en crème als ondergrond. Het handelsmerk is de streep: vier of vijf kleurbanden, gestapeld als een zonsondergang, met harde randen in plaats van een vloeiend verloop.

- Crème: #f2e2c4
- Oogstgoud: #e0a526
- Gebrand oranje: #d9661f
- Roest: #a8431f
- Chocolade: #4a2c1d
- Avocado: #7d7b35

Een palet uit de jaren 70. Alles neigt naar warm, zelfs het groen.

Zonsondergangstrepen uit de jaren 70: `linear-gradient(180deg, #f2e2c4 0 20%, #e0a526 20% 36%, #d9661f 36% 52%, #a8431f 52% 68%, #4a2c1d 68%)`

Harde kleurstops maken strepen: elke kleur begint precies waar de vorige eindigt. Dit is het herkenbaarste retro kleurverloop van allemaal.

Vloeiende verlopen uit dezelfde kleuren voelen zachter en passen beter bij foto’s of lange tekst dan strepen. Houd ze in de warme familie en ze worden nooit modderig, omdat elke stap een naaste buur van de vorige is. Zie voor vloeiendere warme luchten [zonsondergangverlopen](https://gradiently.design/nl/guide/sunset-gradient).

- Oogstzonsondergang: `linear-gradient(180deg, #e0a526 0%, #d9661f 50%, #a8431f 100%)`
- Avocadokeuken: `linear-gradient(135deg, #7d7b35 0%, #b9a44c 50%, #e9d8a6 100%)`
- Bruin fluweel: `radial-gradient(circle at 50% 30%, #c77d3a 0%, #6b3a1f 55%, #2e1a10 100%)`
- Cream soda: `linear-gradient(180deg, #f2e2c4 0%, #f0c27a 55%, #e0a526 100%)`

Vloeiende verlopen uit de jaren 70: goud naar roest, avocado naar crème, een fluwelige bruine gloed en een bleek crème naar goud.

## Kleurverlopen uit de jaren 80: neonnachten en pastelpop

De jaren 80 gaven ons twee heel verschillende looks. De ene is de neonnacht: magenta en cyaan die op zwart gloeien, chromen letters en rasters, ontleend aan de films en arcadespellen van die tijd. De andere is felle, speelse pastelpop: roze, teal, kanariegeel en lila, vaak met zwarte krabbels en geometrische vormen. Onze gids over [vaporwave-kleuren](https://gradiently.design/nl/guide/vaporwave-colors) behandelt de neonnacht uitgebreid, inclusief een zonsondergang en raster in CSS.

- Kauwgom: #ff4f9a
- Zwembadteal: #00c2c7
- Kanarie: #ffe14d
- Lila: #b18cff
- Krabbelzwart: #111111

Pastelpop uit de jaren 80. Zwart hoort bij het palet: het omlijnt vormen en voorkomt dat de felle kleuren gaan zweven.

- Neonnacht: `linear-gradient(180deg, #0b0221 0%, #2d0b59 60%, #ff2a6d 100%)`
- Chroom: `linear-gradient(180deg, #ffffff 0%, #9fb3c8 46%, #2b3a55 50%, #d6c0ff 100%)`
- Aerobics: `linear-gradient(90deg, #ff4f9a 0%, #b18cff 50%, #00c2c7 100%)`
- Popstreep: `repeating-linear-gradient(45deg, #ffe14d 0 14px, #ff4f9a 14px 28px)`

Kleurverlopen uit de jaren 80. Chroom gebruikt een harde stop op 46 tot 50% om een weerspiegelde horizon na te bootsen; Popstreep is een herhalend kleurverloop, dus het herhaalt zich eindeloos.

## Kleurverlopen uit de jaren 90: teal, paars en titelbalkblauw

De kleur van de jaren 90 is koeler en digitaler. Teal was overal, vaak samen met paars en magenta op sporttenues, verpakkingen en vroege webpagina’s. Desktopsoftware bracht het verloop van marine naar helderblauw in de titelbalken van vensters, een van de eerste kleurverlopen die veel mensen op een scherm zagen. Later in het decennium kwamen doorschijnend teal plastic en, in druk, diepere juweeltinten zoals jachtgroen, bordeaux en pruim.

- Titelbalkblauw: `linear-gradient(90deg, #000080 0%, #1084d0 100%)`
- Teal naar magenta: `linear-gradient(135deg, #0f7c80 0%, #5b2a86 60%, #c2185b 100%)`
- Doorschijnend teal: `linear-gradient(160deg, #b8f1f0 0%, #3cc6c4 50%, #1a7f8e 100%)`
- Pruim en bordeaux: `linear-gradient(160deg, #3d1f4f 0%, #800020 100%)`
- Jachtgroen: `linear-gradient(160deg, #2f4f3a 0%, #6b7d4f 100%)`

Kleurverlopen uit de jaren 90, van het scherm (titelbalkblauw) via het schap (doorschijnend teal) tot de pagina (juweeltinten).

De millenniumwisseling is een verhaal apart: zilver, iriserend en bubbelig. Die look heeft een eigen gids, de [Y2K-esthetiek](https://gradiently.design/nl/guide/y2k-aesthetic), en hij past vanzelf bij [holografische kleurverlopen](https://gradiently.design/nl/guide/holographic-gradients).

## Retro kleurverlopen per decennium in één oogopslag

| Decennium | Hoofdkleuren | Stijl van het verloop | Het best voor |
| --- | --- | --- | --- |
| Jaren 70 | Goud, oranje, roest, bruin, avocado | Harde strepen, warme zachte verlopen | Eten, drinken, vintagewinkels, muziek |
| Jaren 80 neon | Magenta, cyaan, violet op zwart | Gloeiende horizonten, chroom | Nachtleven, gaming, synthmuziek |
| Jaren 80 pop | Roze, teal, kanarie, lila, zwart | Felle verlopen, strepen, vormen | Kinderen, fitness, speelse lanceringen |
| Jaren 90 | Teal, paars, marine, juweeltinten | Diagonale verlopen, titelbalkblauw | Technostalgie, streetwear, zines |

Kies het decennium op de sfeer die je wilt, niet alleen op het tijdperk waarin je publiek opgroeide.

## Zo moderniseer je een retro kleurverloop

Een retro kleurverloop dat exact is gekopieerd, kan op een verkleedpak lijken. Modern retro houdt het palet dat mensen herkennen en verandert de afwerking: zachtere randen, iets rustigere kleur en een textuur die als drukwerk voelt in plaats van als een vlak scherm.

1. **Houd het palet, verzacht de randen** Geef elke streep een korte overgang van 3 tot 4% in plaats van een harde stop. Het leest nog steeds als strepen, maar het oogt gedrukt in plaats van getekend.
2. **Haal er een beetje verzadiging uit** De oorspronkelijke kleurstalen werden vaak in druk of op doffe schermen gezien. Ze op moderne, heldere schermen iets dimmen komt dichter bij hoe ze aanvoelden.
3. **Meng in OKLCH** Interpoleren in OKLCH houdt het midden van elk verloop helder in plaats van grijzig. [CSS-kleurverlopen in OKLCH](https://gradiently.design/nl/guide/css-gradient-oklch) legt uit hoe.
4. **Voeg fijne korrel toe** Korrel geeft de textuur van film en papier en verbergt banding. [Korrelige kleurverlopen](https://gradiently.design/nl/guide/grainy-gradients) heeft het recept.
5. **Gebruik moderne letters** Laat de kleur het decennium dragen en kies een strak, hedendaags lettertype. Kleur uit die tijd plus letters uit die tijd, en het slaat om in pastiche.

```css
/* Original: hard seventies stripes */
.retro {
  background: linear-gradient(180deg, #f2e2c4 0 20%, #e0a526 20% 36%, #d9661f 36% 52%, #a8431f 52% 68%, #4a2c1d 68%);
}

/* Modernised: softer colours, short blends, OKLCH, fine grain */
.retro-modern {
  background:
    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='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E"),
    linear-gradient(180deg in oklch, #f4e6cc 0 18%, #dba84a 22% 34%, #d27a45 38% 50%, #a95a3c 54% 66%, #5a3a2a 70%);
}
```

Twee keer dezelfde strepen. De moderne versie gebruikt iets rustigere kleuren, overgangen van 4% tussen de banden, interpolatie in OKLCH en een SVG-ruislaag erbovenop.

### Gedateerd

- Harde, verzadigde strepen, recht uit een stalenboek
- Lettertype, layout en kleur uit die tijd, allemaal tegelijk
- Vlakke kleur met zichtbare banding
- Elk retrocliché in één ontwerp

### Modern retro

- Korte overgangen tussen de banden, iets rustigere kleur
- Retrokleur met strakke, hedendaagse letters
- Fijne korrel voor een gedrukt gevoel
- Eén decennium, één motief, volop ruimte

Een A4-poster die een zomeruitverkoop van vintage denim, suède en ribfluweel aankondigt

Een A4-poster: de warmte van de jaren 70 met moderne, royale letters.

Een vierkante playlistcover met de titel Liedjes van het cassettedeck

Een playlistcover: één sterke regel laat de kleur het tijdreizen doen.

Wil je een retrolook die je kunt houden, beschrijf hem dan in de [Forge](/forge) van Gradiently, bijvoorbeeld ‘zonsondergangstrepen uit de jaren 70 op crème, met korrel’, en hij bouwt een Mark uit die zin. Raadpleeg voor drukwerk [kleurverlopen drukken](https://gradiently.design/nl/guide/print-gradients) voordat je bestanden verstuurt, want warm oranje en bruin kunnen op papier verschuiven.

## FAQ

### Welke kleuren laten een kleurverloop retro ogen?

Kleuren die sterk aan een decennium vastzitten: mosterd, oranje, roest en bruin voor de jaren 70, neonmagenta en cyaan of felle pastels voor de jaren 80, en teal, paars en marine voor de jaren 90.

### Hoe maak ik jaren 70-strepen in CSS?

Gebruik harde kleurstops, waarbij elke kleur precies begint waar de vorige eindigt, bijvoorbeeld `linear-gradient(180deg, #f2e2c4 0 20%, #e0a526 20% 36%, #d9661f 36% 52%, #a8431f 52% 68%, #4a2c1d 68%)`.

### Hoe voorkom ik dat een retro kleurverloop gedateerd oogt?

Houd het palet, maar verzacht de randen van de strepen, verlaag de verzadiging iets, meng in OKLCH, voeg fijne korrel toe en combineer het met strakke, moderne letters.

### Wat is het verschil tussen retro en vintage kleurverlopen?

De woorden worden bijna door elkaar gebruikt. Retro betekent meestal een nieuw ontwerp dat naar een vroeger decennium verwijst, terwijl vintage iets suggereert wat er echt oud uitziet, vaak met meer textuur en verbleking.

### Welk decennium past bij mijn merk?

Kies op sfeer: de jaren 70 voor warmte en ambacht, jaren 80-neon voor nachtleven en energie, jaren 80-pop voor speelsheid, en de jaren 90 voor digitale nostalgie en streetwear.