# Gradiente verde lime: codici vivaci sotto controllo

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

Il lime è il verde più rumoroso che esista. Usato con un piano sembra nitido e moderno; senza, sembra un evidenziatore. Ecco i codici e le regole per tenerlo dalla tua parte.

## The short version

- Un gradiente verde lime fonde verdi tendenti al giallo come #bef264, #a3e635 e #84cc16, di solito verso un oliva più scuro, un quasi nero o un giallo o un verde acqua vicini.
- Il lime è molto chiaro rispetto alla sua saturazione, quindi il testo bianco quasi sempre non supera il contrasto, mentre un inchiostro verde profondo o quasi nero si legge molto meglio.
- Il lime brilla di più su un fondo quasi nero, dove una piccola quantità regge un intero design.
- Sfumare il lime direttamente nel viola o nel rosa tende a produrre un centro grigio: tieni questi abbinamenti in aree separate o passa da un colore ponte.
- Il lime si adatta a sport, musica, lanci tech e cibo fresco, e funziona meglio come accento che come intera superficie.

Un **gradiente verde lime** fonde il lato giallo del verde: agrumi pallidi come `#d9f99d`, lime brillante come `#a3e635` e toni foglia più profondi come `#65a30d`, spesso sfumati verso nero, oliva, limone o verde acqua. Il controllo nasce da tre scelte: quanta superficie è lime, su quale fondo poggia e di che colore sono le parole. Se le azzecchi, il lime appare voluto e attuale. Qui sotto trovi codici di gradienti lime per ogni atmosfera, gli inchiostri che si leggono sopra e gli abbinamenti che restano puliti.

## Perché il lime si comporta diversamente dagli altri verdi

Il lime sta tra il giallo e il verde sul cerchio cromatico e, come il giallo, è chiarissimo anche alla massima saturazione. Da qui nascono la sua energia e i suoi problemi. Salta fuori da uno schermo scuro, ma sbiadisce il testo bianco e stanca l’occhio quando riempie una grande area. Un verde foresta o smeraldo si comporta più come il blu; il lime si comporta come un evidenziatore. La famiglia più ampia è trattata in [gradienti verdi](https://gradiently.design/it/guide/green-gradient).

- Nebbia di agrumi: #ecfccb
- Lime pallido: #d9f99d
- Lime fresco: #bef264
- Lime: #a3e635
- Lime foglia: #84cc16
- Lime profondo: #65a30d
- Oliva: #3f6212
- Inchiostro lime: #1a2e05

Una scala lime funzionante, da quasi bianco a quasi nero. I gradienti costruiti con colori vicini su questa scala non diventano mai fangosi.

## Codici di gradienti verde lime su fondo scuro

Qui il lime si guadagna la fama. Su un fondo quasi nero un piccolo bagliore di lime risulta elettrico senza stancare, perché l’occhio ha un punto scuro dove riposare. Tieni il lime in un angolo o in una fascia e lascia che sia il fondo a fare la maggior parte del lavoro.

- Luce lime sul nero: `radial-gradient(circle at 80% 20%, #a3e635 0%, #3f6212 30%, #0b0f05 70%)`
- Dalla notte al lime: `linear-gradient(160deg, #0b0f05 0%, #1a2e05 45%, #84cc16 100%)`
- Bagliore da stadio: `radial-gradient(ellipse at 50% 110%, #bef264 0%, #4d7c0f 35%, #0a0d06 75%)`
- Dal verde acqua scuro al lime: `linear-gradient(135deg, #0b1a14 0%, #134e4a 45%, #a3e635 100%)`

Quattro gradienti lime scuri. Ognuno tiene il lime più brillante in una sola zona, così i titoli possono stare sul lato scuro.

È nelle sfumature scure come queste che compare per primo il banding, soprattutto dopo che una piattaforma le ricomprime. Un sottile strato di grana lo risolve, e [sfondi sfumati scuri](https://gradiently.design/it/guide/dark-gradient-backgrounds) offre altri fondi da provare.

## Gradienti lime tenui e pastelli agrumati

Il lime ammorbidito verso crema o menta perde l’urlo e diventa fresco, pulito e un po’ botanico. Va bene per caffè, spremute, skincare e campagne primaverili. Scalda un’estremità con un po’ di limone o crema, così il risultato sembra soleggiato e non clinico.

- Dal limone alla crema lime: `linear-gradient(135deg, #fefce8 0%, #ecfccb 50%, #d9f99d 100%)`
- Dal lime alla menta: `linear-gradient(180deg, #f7fee7 0%, #d1fae5 100%)`
- Sole agrumato: `radial-gradient(circle at 30% 30%, #fef9c3 0%, #d9f99d 45%, #bef264 100%)`

Gradienti lime pallidi per brand calmi e freschi. L’inchiostro verde scuro si legge benissimo su tutti e tre.

Se vuoi che il colore vada ancora di più verso il fresco e il pulito, i [gradienti menta](https://gradiently.design/it/guide/mint-gradient) sono qui accanto.

## Colori che si abbinano bene al lime

Il lime si fonde bene con i suoi vicini: il giallo da un lato, il verde e il verde acqua dall’altro. Queste transizioni restano luminose fino in fondo. I problemi iniziano con i colori dall’altra parte del cerchio. Viola e magenta sono vicini al complementare del lime e una sfumatura diretta passa per un centro grigio spento. [Gradienti fangosi](https://gradiently.design/it/guide/muddy-gradients) spiega esattamente perché succede.

### Da evitare

- Lime sfumato direttamente in viola o magenta
- Testo bianco sul lime brillante
- Lime che riempie ogni pixel di un grande poster
- Lime con il rosso, che sembra un segnale di pericolo

### Da fare

- Lime verso giallo, verde acqua o oliva scuro
- Inchiostro quasi nero o verde profondo sul lime
- Lime come bagliore su fondo scuro o crema
- Viola o rosa accanto al lime, non sfumati dentro di esso

Lime, limone, mandarino: `linear-gradient(120deg, #a3e635 0%, #facc15 50%, #f97316 100%)`

Un percorso agrumato completo. Ogni passo è vicino al precedente, quindi il centro resta luminoso invece di virare al marrone.

## Colori del testo che si leggono sul lime

Poiché il lime è così chiaro, l’istinto di metterci sopra testo bianco è quasi sempre sbagliato. La risposta è un inchiostro scuro, meglio se un verde molto profondo, così l’intero design resta nella stessa famiglia. I rapporti qui sotto sono misurati con la formula di contrasto WCAG; 4,5:1 è il minimo abituale per il testo corrente. Per approfondire il metodo, vedi [contrasto dei colori e accessibilità](https://gradiently.design/it/guide/color-contrast-accessibility).

| Sfondo | Testo | Contrasto | Giudizio |
| --- | --- | --- | --- |
| Lime `#a3e635` | Bianco `#ffffff` | 1,5:1 | Non passa, nemmeno per i titoli |
| Lime `#a3e635` | Inchiostro lime `#1a2e05` | 9,7:1 | Eccellente |
| Lime foglia `#84cc16` | Bianco `#ffffff` | 2,0:1 | Non passa |
| Lime pallido `#d9f99d` | Inchiostro lime `#1a2e05` | 12,5:1 | Eccellente |
| Oliva `#3f6212` | Bianco `#ffffff` | 7,1:1 | Buono, da usare per l’estremo scuro |
| Quasi nero `#0b0f05` | Lime `#a3e635` | 12,8:1 | Eccellente, lime come inchiostro |

Su un gradiente, controlla il punto più chiaro dietro ogni riga di testo, non il colore medio.

Nota l’ultima riga: il lime è un ottimo colore per il testo sul nero. Un titolo lime su un gradiente quasi nero è uno degli abbinamenti più leggibili che esistano. [Testo su un gradiente](https://gradiently.design/it/guide/text-on-gradient) spiega cosa fare quando le parole attraversano entrambe le estremità di una sfumatura.

Un post verticale di lancio prodotto che annuncia scarpe da campo in lime, con testo chiaro su un gradiente verde scuro illuminato dal lime in un angolo

Abbigliamento sportivo su fondo scuro con una luce lime. Le parole stanno sul lato scuro.

Un post verticale per un bar di spremute con titolo verde scuro su un gradiente lime pallido e limone

Un post per un bar di spremute su un fondo agrumato tenue, con inchiostro verde profondo.

## CSS dei gradienti lime per pulsanti e hero

Sul web il lime funziona benissimo come invito all’azione su una pagina scura e male come sfondo dell’intera pagina. Lo snippet qui sotto dà un hero scuro con un bagliore lime e un pulsante lime con testo scuro. Interpolare in OKLCH mantiene la sfumatura luminosa dove sRGB cala; [gradienti OKLCH in CSS](https://gradiently.design/it/guide/css-gradient-oklch) ne spiega la sintassi.

```css
.hero {
  min-height: 80vh;
  background-color: #0b0f05;
  background-image:
    radial-gradient(circle at 85% 15%, #a3e635 0%, transparent 40%),
    linear-gradient(160deg, #0b0f05 0%, #1a2e05 100%);
  color: #f7fee7;
}

.button {
  background: linear-gradient(135deg, #bef264, #84cc16);
  background: linear-gradient(135deg in oklch, #bef264, #84cc16);
  color: #1a2e05;
  border: 0;
  border-radius: 999px;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
}
```

Un hero scuro con una luce lime e un pulsante lime con testo verde profondo. I browser che non supportano `in oklch` saltano il secondo sfondo del pulsante e tengono il primo.

## Dove funziona meglio un gradiente verde lime

- **Sport e fitness:** giorni di partita, iscrizioni a gare, nuove divise. Il lime sul nero dà l’idea di velocità.
- **Musica e vita notturna:** serate in club e copertine di uscite, dove sta naturalmente accanto ai [gradienti neon](https://gradiently.design/it/guide/neon-gradients).
- **Tech e lanci di prodotto:** un solo accento lime fa sembrare acceso un’interfaccia scura.
- **Cibo e bevande fresche:** spremute, insalate, cocktail e tutto ciò che è agrumato, nella gamma pastello più tenue.
- **Campagne primaverili:** lime pallido e limone dicono nuova stagione senza il solito rosa pastello.

Poiché il lime è così riconoscibile, è facile anche somigliare a tutti gli altri che l’hanno scelto quest’anno. In Gradiently ogni Mark viene confrontato con tutti gli altri e rifiutato se è troppo simile, quindi un look lime che riservi è uno che nessun altro può esportare. Anche la leggibilità si adatta dietro ogni riga, così il lime non finisce mai sotto parole bianche per caso.

## FAQ

### Qual è il codice esadecimale del verde lime?

Un lime brillante molto usato è `#a3e635`. I lime più pallidi stanno intorno a `#d9f99d` e quelli più profondi intorno a `#65a30d`. Il lime web puro, `#00ff00`, è molto più aggressivo e raramente funziona nel design.

### Che colore di testo va su un gradiente verde lime?

Usa un verde molto scuro come `#1a2e05` o un quasi nero. Il testo bianco sul lime brillante non supera il contrasto, con circa 1,5:1.

### Quali colori stanno bene con il verde lime in un gradiente?

Giallo, limone, verde acqua, menta e oliva scuro si fondono bene con il lime. Viola e rosa stanno benissimo accanto, ma diventano grigi se li sfumi direttamente.

### Come faccio un gradiente verde neon in CSS?

Metti un bagliore lime su un fondo quasi nero, per esempio `radial-gradient(circle at 80% 20%, #a3e635 0%, #3f6212 30%, #0b0f05 70%)`. È il fondo scuro a far sembrare neon il lime.

### Il verde lime è un buon colore per un brand?

Può esserlo, per brand energici di sport, musica, tech o cibo fresco. Usalo come accento su un fondo scuro o crema invece che su tutta la superficie, e abbinalo a un inchiostro scuro.