# Esthétique années 80 : néon, chrome et soleil couchant

[Canonical HTML page](https://gradiently.design/fr/guide/80s-aesthetic)

Tubes de néon, lettres chromées, un soleil rayé qui s’enfonce dans une grille lumineuse. Le style années 80 a été ressuscité si souvent qu’il a désormais son propre genre musical. Voici comment le construire, avec codes.

## The short version

- L’esthétique années 80 se construit avec des couleurs néon sur fonds sombres, un lettrage chrome, des dégradés de coucher de soleil, des grilles en perspective et des tons pastel façon Miami.
- Une grande part de ce que l’on appelle aujourd’hui esthétique années 80 est filtrée par la synthwave, un style musical et visuel qui a ressuscité le cinéma, les jeux d’arcade et la culture des synthétiseurs des années 1980 à partir des années 2000.
- Un dégradé de coucher de soleil qui va du jaune au violet en passant par l’orange et le rose, souvent découpé en bandes horizontales, est l’arrière-plan années 80 le plus reconnaissable.
- Le lettrage chrome imite le métal poli avec une ligne d’horizon nette au milieu des lettres, là où le reflet d’un ciel clair rencontre celui d’un sol sombre.
- Le néon fonctionne mieux en lignes et en formes sur fond sombre ; gardez la lueur loin du texte courant pour qu’il reste lisible.

L’**esthétique années 80**, c’est du néon sur noir, un lettrage chrome, des dégradés de coucher de soleil découpés en bandes et une grille lumineuse qui file vers l’horizon, avec un côté plus doux de pastels de Miami et de motifs Memphis. La version d’aujourd’hui passe en grande partie par la synthwave, un style qui a ressuscité les films, les jeux d’arcade et la musique de synthétiseur des années 1980 à partir des années 2000. Voici ses ingrédients clés, des palettes avec codes, le CSS d’un soleil et d’une grille, et comment l’utiliser sans tomber dans le déguisement.

## Les ingrédients de l’esthétique années 80

| Ingrédient | D’où il vient | À utiliser pour |
| --- | --- | --- |
| Rose et cyan néon | Enseignes, boîtes de nuit, bornes d’arcade | Lignes, formes et accents sur fonds sombres |
| Dégradés de coucher de soleil | Pochettes d’albums, affiches de films, graphismes de vacances | Arrière-plans et soleil rayé |
| Lettrage chrome | Logos de films, de voitures et d’électronique | Titres d’un ou deux mots |
| Grilles en perspective | Premiers graphismes informatiques et jeux d’arcade | Le sol d’une scène, un séparateur de section |
| Pastels de Miami | Hôtels Art déco et télévision de la décennie | Versions plus claires et plus ensoleillées du style |
| Formes Memphis | Le collectif de design milanais du début des années 80 | Motifs ludiques et confettis |
| Texture VHS | Vidéo domestique | Lignes de balayage et grain sur les images |

Sept ingrédients. Deux ou trois suffisent à faire un design années 80 convaincant ; les sept font une soirée déguisée.

## Esthétique années 80 et synthwave

La synthwave, parfois appelée outrun d’après le jeu d’arcade de conduite de Sega de 1986, est un genre musical né en ligne au milieu des années 2000 qui emprunte beaucoup aux musiques de films des années 80. Ses pochettes ont défini l’image que beaucoup de gens se font aujourd’hui : un ciel violet sombre, un soleil rayé, une grille magenta et des lettres chromées. Le film *Drive* de 2011 et sa bande originale ont aidé à porter le style vers le grand public.

Alors quand un brief dit années 80, demandez quelles années 80. La version synthwave de nuit, la version pastel de Miami en plein jour et la version à motifs Memphis sont trois styles différents. [Les couleurs synthwave](https://gradiently.design/fr/guide/synthwave-colors) et [les couleurs vaporwave](https://gradiently.design/fr/guide/vaporwave-colors) approfondissent les deux renaissances d’Internet, et [le design Memphis](https://gradiently.design/fr/guide/memphis-design) couvre le côté motifs.

## Palettes de couleurs années 80

- Minuit: #0b0221
- Violet profond: #2b0a4a
- Magenta néon: #ff2fd0
- Cyan laser: #00f0ff
- Jaune soleil: #ffd319

Nuit néon. Presque tout l’espace est minuit et violet ; les néons sont des lignes, le jaune est le soleil.

- Flamant: #ff9ecd
- Piscine: #7fe7dc
- Pêche: #ffd1a9
- Stuc: #fdf7f2
- Texte de nuit: #2d1e4a

Miami en plein jour. Des pastels sur un blanc chaud, avec un violet profond pour le texte afin qu’il reste lisible.

- Coucher de soleil outrun: `linear-gradient(180deg, #ffd319 0%, #ff901f 30%, #ff2975 60%, #8c1eff 100%)`
- Soleil rayé: `linear-gradient(180deg, #ffd319 0% 45%, #1a0533 45% 48%, #ff901f 48% 62%, #1a0533 62% 66%, #ff2975 66% 80%, #1a0533 80% 85%, #c2185b 85% 100%)`
- Chrome: `linear-gradient(180deg, #f4f8ff 0%, #9fb3d1 49%, #1b2a4a 50%, #4a5b7c 62%, #e6edf7 100%)`
- Horizon néon: `radial-gradient(circle at 50% 110%, #ff2fd0 0%, #6a0dad 35%, #0b0221 75%)`
- Pastel Miami: `linear-gradient(135deg, #ff9ecd 0%, #ffd1a9 50%, #7fe7dc 100%)`
- Lignes laser: `repeating-linear-gradient(90deg, #0b0221 0 38px, #00f0ff 38px 40px)`

Six dégradés années 80 à copier. Le soleil rayé utilise des arrêts francs pour découper des bandes sombres dans la moitié basse, le soleil synthwave classique.

Le dégradé chrome est celui à étudier. Le métal poli reflète un ciel clair au-dessus d’un sol sombre, donc la couleur part du clair, s’approfondit vers le milieu, bascule au sombre sur une ligne d’horizon nette, puis s’éclaircit de nouveau vers le bas. C’est cette ligne dure qui fait lire du métal plutôt que du gris. [Les effets de texte chrome](https://gradiently.design/fr/guide/chrome-effect) montrent comment l’appliquer à un lettrage, et [les dégradés de coucher de soleil](https://gradiently.design/fr/guide/sunset-gradient) en proposent des versions plus douces pour le ciel.

## Construire un soleil et une grille années 80 en CSS

```css
.scene {
  position: relative;
  height: 100vh;
  overflow: hidden;
  background: linear-gradient(180deg, #0b0221 0%, #2b0a4a 55%, #0b0221 55%);
}

.sun {
  position: absolute;
  left: 50%;
  top: 18%;
  width: min(40vw, 320px);
  aspect-ratio: 1;
  translate: -50% 0;
  border-radius: 50%;
  background: linear-gradient(180deg, #ffd319 0%, #ff901f 45%, #ff2975 80%);
  /* slice the lower half into bands */
  mask-image: linear-gradient(180deg, #000 0 58%, transparent 58% 61%, #000 61% 70%, transparent 70% 74%, #000 74% 83%, transparent 83% 88%, #000 88%);
}

.floor {
  position: absolute;
  left: -50%;
  right: -50%;
  top: 55%;
  bottom: -20%;
  background-image:
    linear-gradient(#ff2fd0 2px, transparent 2px),
    linear-gradient(90deg, #ff2fd0 2px, transparent 2px);
  background-size: 60px 60px;
  transform: perspective(320px) rotateX(62deg);
  transform-origin: top center;
}
```

Un ciel violet, un soleil rayé et un sol en grille magenta incliné en perspective. Placez `.sun` et `.floor` dans `.scene`.

Pour l’animer, déplacez le `background-position` du sol vers le bas en boucle et la grille semble foncer vers vous. Respectez les réglages de réduction des animations quand vous le faites ; [les dégradés CSS animés](https://gradiently.design/fr/guide/css-animated-gradient) détaillent le procédé.

## Polices et lettrage années 80

Le texte faisait une grande part du travail dans les graphismes de la décennie. Les titres de films et les logos de produits utilisaient de lourdes italiques pour la vitesse, des capitales chromées ou extrudées pour le drame, et des scripts pinceau lâches pour tout ce qui se passait sur une plage. Un seul mot ainsi traité peut porter tout un design.

- **Les sans empattement italiques lourds** suggèrent le mouvement, parfaits pour tout ce qui est sportif ou rapide.
- **Les capitales chromées** fonctionnent pour un ou deux mots au plus ; les lignes plus longues perdent le reflet.
- **Les scripts pinceau** s’associent à la palette Miami, en petit à côté d’un sans empattement gras.
- **Les polices pixel et grille** font un clin d’œil aux arcades, mais se lisent mal sous une grande taille, gardez-les donc pour les titres.

Pour des familles à essayer, [les polices rétro](https://gradiently.design/fr/guide/retro-fonts) en liste par décennie.

## Comment utiliser l’esthétique années 80 sans cliché

### Cliché

- Soleil, grille, palmiers, chrome et VHS en même temps
- Une lueur néon autour de chaque ligne de texte
- Un script, une police chrome et une police pixel ensemble
- Du rétro pour le rétro, sans lien avec la marque

### Réfléchi

- Un ingrédient héros, comme le soleil rayé
- Du néon sur les lignes et les formes, un texte net sur les zones calmes
- Une police d’affichage pour le titre, un sans empattement simple pour les détails
- Une raison : un produit rétro, un anniversaire, une soirée musicale

Si vous concevez dans Gradiently, ses traitements de lettrage Extrusion et Traînée donnent à un titre la profondeur et la vitesse d’un carton de titre années 80, et un Mark sombre avec des lumières violettes et magenta en fait le ciel nocturne, en gardant sa zone la plus calme derrière les mots pour que le texte reste net.

Une affiche de soirée en portrait avec Nuit synthé sur un arrière-plan violet sombre et magenta

Une affiche de soirée années 80 : fond sombre, un seul titre audacieux, détails petits et simples.

Une miniature YouTube en paysage avec Retour en 1986 et un numéro d’épisode au-dessus

Une miniature YouTube en 1280×720 avec un titre court et lourd qui se lit en petit.

Le style convient aux soirées musicales, aux chaînes de jeux, aux lancements de produits rétro, aux anniversaires et à tout ce qui veut un clin d’œil de nostalgie. Si vous voulez la décennie suivante, lisez [l’esthétique années 90](https://gradiently.design/fr/guide/90s-aesthetic).

## FAQ

### Qu’est-ce que l’esthétique années 80 ?

Un style visuel fait de couleurs néon sur fonds sombres, de lettrage chrome, de dégradés de coucher de soleil, de grilles en perspective, de pastels de Miami et de motifs Memphis.

### Quelles couleurs dans une palette années 80 ?

Magenta néon, cyan laser et jaune soleil sur minuit et violet profond pour le look de nuit, ou rose flamant, bleu piscine et pêche pour le look Miami.

### Quelle différence entre l’esthétique années 80 et la synthwave ?

L’esthétique années 80 est le design propre à la décennie. La synthwave est un style musical et artistique plus tardif qui la ressuscite, et ses visuels ont façonné le look néon, soleil et grille que beaucoup imaginent aujourd’hui.

### Comment faire un coucher de soleil années 80 en CSS ?

Utilisez un dégradé linéaire vertical du jaune au violet en passant par l’orange et le rose, et ajoutez des arrêts francs ou un masque pour découper des bandes sombres dans la moitié basse.

### Quelles polices font années 80 ?

Un lettrage d’affichage chrome ou extrudé, des scripts pinceau et des sans empattement italiques lourds. Utilisez-en une pour le titre et un sans empattement simple pour tout le reste.