# Estetica anni 80: neon, cromature e tramonti sfumati

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

Tubi al neon, scritte cromate, un sole a strisce che affonda in una griglia luminosa. Lo stile anni 80 è stato ripreso così spesso da avere un genere musicale tutto suo. Ecco come costruirlo, con i codici.

## The short version

- L’estetica anni 80 nasce da colori neon su fondi scuri, lettering cromato, sfumature da tramonto, griglie in prospettiva e toni pastello alla Miami.
- Gran parte di ciò che oggi chiamiamo estetica anni 80 passa dal filtro della synthwave, uno stile musicale e visivo che dagli anni Duemila ha rilanciato cinema, sale giochi e sintetizzatori degli anni Ottanta.
- Un tramonto che va dal giallo al viola passando per arancione e rosa, spesso tagliato in fasce orizzontali, è lo sfondo anni 80 più riconoscibile in assoluto.
- Il lettering cromato imita il metallo lucido con una netta linea d’orizzonte a metà delle lettere, dove il riflesso di un cielo chiaro incontra quello di un suolo scuro.
- Il neon dà il meglio come linee e forme su fondo scuro; tieni il bagliore lontano dal testo corrente, così resta leggibile.

L’**estetica anni 80** è neon su nero, lettering cromato, tramonti sfumati tagliati in fasce e una griglia luminosa che corre verso l’orizzonte, con un lato più morbido fatto di pastelli alla Miami e pattern Memphis. Gran parte della versione di oggi passa dalla synthwave, uno stile che dagli anni Duemila ha ripreso i film, i videogiochi da sala e la musica a sintetizzatori degli anni Ottanta. Qui sotto trovi gli ingredienti chiave, le palette con i codici, il CSS per tramonto e griglia e come usarla senza scivolare nel costume.

## Gli ingredienti dell’estetica anni 80

| Ingrediente | Da dove viene | Dove usarlo |
| --- | --- | --- |
| Rosa e ciano neon | Insegne, locali notturni, cabinati da sala giochi | Linee, forme e accenti su fondi scuri |
| Sfumature da tramonto | Copertine di dischi, locandine di film, grafiche da vacanza | Sfondi e un sole a strisce |
| Lettering cromato | Logo di film, auto ed elettronica | Titoli di una o due parole |
| Griglie in prospettiva | Primi computer grafici e giochi da sala | Il pavimento di una scena, un divisore di sezione |
| Pastelli Miami | Hotel Art Déco e televisione del decennio | Versioni più chiare e solari dello stile |
| Forme Memphis | Il collettivo di design milanese dei primi anni 80 | Pattern giocosi e coriandoli |
| Texture VHS | Il video domestico | Linee di scansione e grana sulle immagini |

Sette ingredienti. Due o tre bastano per un design anni 80 convincente; tutti e sette fanno una festa in maschera.

## Estetica anni 80 e synthwave

La synthwave, a volte chiamata outrun dal gioco di guida di Sega del 1986, è un genere musicale cresciuto online dalla metà degli anni Duemila che attinge molto alle colonne sonore dei film anni 80. La sua grafica ha definito l’immagine che molti oggi hanno in mente: un cielo viola scuro, un sole a strisce, una griglia magenta e scritte cromate. Il film *Drive* del 2011 e la sua colonna sonora hanno aiutato lo stile ad arrivare al grande pubblico.

Quindi, quando un brief dice anni 80, chiedi quali. La versione notturna synthwave, quella diurna in pastelli Miami e quella a pattern Memphis sono tre stili diversi. [Colori synthwave](https://gradiently.design/it/guide/synthwave-colors) e [colori vaporwave](https://gradiently.design/it/guide/vaporwave-colors) approfondiscono i due revival nati su internet, mentre [design Memphis](https://gradiently.design/it/guide/memphis-design) tratta il lato dei pattern.

## Palette di colori anni 80

- Mezzanotte: #0b0221
- Viola profondo: #2b0a4a
- Magenta neon: #ff2fd0
- Ciano laser: #00f0ff
- Giallo sole: #ffd319

Notte al neon. Quasi tutto lo spazio è mezzanotte e viola; i neon sono linee, il giallo è il sole.

- Fenicottero: #ff9ecd
- Piscina: #7fe7dc
- Pesca: #ffd1a9
- Stucco: #fdf7f2
- Testo notte: #2d1e4a

Miami di giorno. Pastelli su un bianco caldo, con un viola profondo per il testo così resta leggibile.

- Tramonto outrun: `linear-gradient(180deg, #ffd319 0%, #ff901f 30%, #ff2975 60%, #8c1eff 100%)`
- Sole a fasce: `linear-gradient(180deg, #ffd319 0% 45%, #1a0533 45% 48%, #ff901f 48% 62%, #1a0533 62% 66%, #ff2975 66% 80%, #1a0533 80% 85%, #c2185b 85% 100%)`
- Cromo: `linear-gradient(180deg, #f4f8ff 0%, #9fb3d1 49%, #1b2a4a 50%, #4a5b7c 62%, #e6edf7 100%)`
- Orizzonte neon: `radial-gradient(circle at 50% 110%, #ff2fd0 0%, #6a0dad 35%, #0b0221 75%)`
- Pastello Miami: `linear-gradient(135deg, #ff9ecd 0%, #ffd1a9 50%, #7fe7dc 100%)`
- Linee laser: `repeating-linear-gradient(90deg, #0b0221 0 38px, #00f0ff 38px 40px)`

Sei sfumature anni 80 da copiare. Il sole a fasce usa stop netti per tagliare bande scure nella metà inferiore, il classico sole synthwave.

La sfumatura cromata è quella da studiare. Il metallo lucido riflette un cielo chiaro sopra un suolo scuro, quindi il colore parte chiaro, si fa più profondo verso il centro, scatta al buio su una netta linea d’orizzonte, poi si schiarisce di nuovo verso il basso. È quella linea netta a farlo sembrare metallo e non grigio. [Effetti testo cromato](https://gradiently.design/it/guide/chrome-effect) mostra come applicarla al lettering, mentre [sfumature da tramonto](https://gradiently.design/it/guide/sunset-gradient) offre versioni più morbide del cielo.

## Costruire un tramonto anni 80 con griglia in 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 cielo viola, un sole a strisce e un pavimento a griglia magenta inclinato in prospettiva. Metti `.sun` e `.floor` dentro `.scene`.

Per animarlo, sposta in loop la `background-position` del pavimento verso il basso e la griglia sembrerà correre verso di te. Rispetta le impostazioni di movimento ridotto; [sfumature animate in CSS](https://gradiently.design/it/guide/css-animated-gradient) tratta lo schema.

## Font e lettering anni 80

La tipografia faceva gran parte del lavoro nella grafica del decennio. I titoli dei film e i logo dei prodotti usavano corsivi pesanti per la velocità, maiuscole cromate o estruse per il dramma e corsivi a pennello sciolti per tutto ciò che era ambientato in spiaggia. Una sola parola trattata così può reggere un intero design.

- **I sans serif corsivi e pesanti** suggeriscono movimento, perfetti per tutto ciò che è sportivo o veloce.
- **Le maiuscole cromate** funzionano al massimo per una o due parole; le righe più lunghe perdono il riflesso.
- **I corsivi a pennello** si abbinano alla palette Miami, in piccolo accanto a un sans deciso.
- **I font pixel e a griglia** strizzano l’occhio alle sale giochi, ma si leggono male sotto una certa grandezza, quindi tienili per i titoli.

Per le famiglie da provare, [font retrò](https://gradiently.design/it/guide/retro-fonts) elenca opzioni per decennio.

## Come usare l’estetica anni 80 senza cliché

### Cliché

- Sole, griglia, palme, cromo e VHS tutti insieme
- Bagliore neon attorno a ogni riga di testo
- Un font corsivo, uno cromato e uno pixel insieme
- Retrò fine a sé stesso, senza legame con il brand

### Curato

- Un solo ingrediente protagonista, come il sole a fasce
- Neon su linee e forme, testo nitido nelle aree calme
- Un carattere display per il titolo, un sans semplice per i dettagli
- Un motivo: un prodotto retrò, un anniversario, una serata musicale

Se progetti in Gradiently, i trattamenti di lettering Estrusione e Scia danno a un titolo la profondità e la velocità di una schermata di apertura anni 80, e un Mark scuro con luce viola e magenta crea il cielo notturno adatto, tenendo la sua zona più calma dietro le parole così il testo resta nitido.

Un manifesto verticale per una serata in locale con la scritta Synth night su uno sfondo viola scuro e magenta

Un manifesto per una serata anni 80: fondo scuro, un solo titolo deciso, dettagli piccoli e semplici.

Una miniatura YouTube orizzontale con la scritta Back to 1986 e un numero di episodio sopra

Una miniatura YouTube da 1280×720 con un titolo breve e pesante che si legge anche in piccolo.

Lo stile si adatta a serate musicali, canali di gaming, lanci di prodotti retrò, anniversari e a tutto ciò che vuole una strizzata d’occhio alla nostalgia. Se ti interessa il decennio successivo, leggi [estetica anni 90](https://gradiently.design/it/guide/90s-aesthetic).

## FAQ

### Che cos’è l’estetica anni 80?

Uno stile visivo fatto di colori neon su fondi scuri, lettering cromato, sfumature da tramonto, griglie in prospettiva, pastelli Miami e pattern Memphis.

### Quali colori ci sono in una palette anni 80?

Magenta neon, ciano laser e giallo sole su mezzanotte e viola profondo per lo stile notturno, oppure rosa fenicottero, turchese piscina e pesca per lo stile Miami.

### Che differenza c’è tra estetica anni 80 e synthwave?

L’estetica anni 80 è il design del decennio stesso. La synthwave è uno stile musicale e artistico successivo che lo riprende, e la sua grafica ha plasmato il look con tramonto neon e griglia che molti oggi hanno in mente.

### Come si crea un tramonto anni 80 in CSS?

Usa una sfumatura lineare verticale dal giallo al viola passando per arancione e rosa, e aggiungi stop netti o una maschera per tagliare bande scure nella metà inferiore.

### Quali font hanno un look anni 80?

Lettering display cromato o estruso, corsivi a pennello e sans serif corsivi pesanti. Usane uno per il titolo e un sans semplice per tutto il resto.