# Gradienti verdi: freschi, profondi ed elettrici [Canonical HTML page](https://gradiently.design/it/guide/green-gradient) Il verde può essere una mattina di primavera, un club privato o il volantino di un rave. Ecco i gradienti verdi per ciascuno, con i codici, e una via d’uscita dal cliché verde foglia. ## The short version - Un gradiente verde sfuma tonalità di verde, dalla menta pallida e dalla salvia allo smeraldo, al verde foresta e al lime elettrico, spesso con un verde acqua o un giallo vicino. - Il verde è molto associato a natura, salute, crescita e denaro, ed è per questo che è così comune in sostenibilità, benessere e finanza. - Il verde sfuma in modo pulito verso verde acqua, blu e giallo, ma tende a diventare grigio se sfumato direttamente in rosa, rosso o viola. - Il testo bianco funziona sui verdi profondi come #14532d, ma un verde medio come #16a34a richiede testo scuro o dimensioni grandi. - Verdi inattesi come oliva, bottiglia e chartreuse, abbinati a un colore non naturale, evitano il look eco già visto. Un **gradiente verde** sfuma tonalità di verde, dalla menta pallida e dalla salvia, passando per smeraldo e foresta, fino al lime elettrico, spesso con un verde acqua o un giallo vicino. Il verde ha più gamma di quasi ogni altro colore: può sembrare fresco e pulito, profondo e costoso, o forte e sintetico. Qui sotto trovi palette di gradienti verdi per ogni atmosfera con CSS da copiare, i colori di testo che funzionano su di esse e come evitare di somigliare a ogni report di sostenibilità. ## La famiglia dei verdi I verdi pendono in due direzioni. Verso il giallo diventano lime, chartreuse e oliva, che sembrano caldi, energici o terrosi. Verso il blu diventano verde acqua, giada e smeraldo, che sembrano freddi, calmi e curati. Se li smorzi ottieni la salvia, morbida e adulta. Se li scurisci ottieni foresta e verde bottiglia, che sembrano radicati e un po’ lussuosi. - Menta: #d1fae5 - Salvia: #a3b18a - Lime: #a3e635 - Smeraldo: #059669 - Verde acqua: #0f766e - Oliva: #556b2f - Foresta: #14532d - Verde bottiglia: #0b3b2e Otto verdi. Versioni tendenti al giallo, tendenti al blu, smorzate e profonde di una sola famiglia di colore. ## Cosa segnala un gradiente verde Le associazioni più condivise del verde sono natura, crescita, salute e freschezza, che vengono direttamente dalle piante. La convenzione ne ha aggiunte altre: via libera nei semafori, denaro negli Stati Uniti per via delle banconote, e successo nei cruscotti e nelle app di finanza. In alcuni luoghi porta anche significati religiosi e nazionali; i [significati dei colori nel mondo](https://gradiently.design/it/guide/color-meanings-around-the-world) li trattano. In pratica significa che è la tonalità a parlare quasi tutto. La menta dice pulito. La salvia dice calmo e ponderato. Foresta e bottiglia dicono tradizione. Il lime dice energia. Il verde acqua dice cura. Decidi quale di queste intendi prima di scegliere un gradiente, e le palette qui sotto diventano molto più facili da scegliere. ## Gradienti verdi freschi e menta I verdi pallidi sembrano puliti, freddi e leggeri. Si adattano a cura della pelle, salute, cibo e a tutto ciò che deve sembrare fresco. Tieni il testo scuro e scaldali leggermente a un’estremità perché non sembrino clinici. - Menta: `linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 100%)` - Mattina di primavera: `linear-gradient(160deg, #f0fdf4 0%, #bbf7d0 55%, #fef9c3 100%)` - Carta salvia: `linear-gradient(135deg, #e3eadb 0%, #a3b18a 100%)` - Da acqua a lime: `linear-gradient(135deg, #ccfbf1 0%, #d9f99d 100%)` Gradienti verdi chiari. Le estremità gialla e lime aggiungono calore e impediscono che sembrino freddi. ## Gradienti verdi profondi e foresta I verdi scuri sono tra i colori dall’aspetto più costoso in assoluto. Pensa alle auto da corsa, alle vecchie biblioteche e ai packaging di tradizione. Portano bene il testo bianco e crema e si abbinano splendidamente a oro, ottone e bianco sporco caldo. - Verde bottiglia: `linear-gradient(180deg, #03140e 0%, #0b3b2e 55%, #1f6f50 100%)` - Sottobosco: `linear-gradient(160deg, #0a1f14 0%, #14532d 55%, #3f7d4e 100%)` - Alone di smeraldo: `radial-gradient(circle at 70% 20%, #34d399 0%, #065f46 40%, #022c22 100%)` - Da oliva a ottone: `linear-gradient(135deg, #1a2410 0%, #556b2f 60%, #c9b458 100%)` Gradienti verdi profondi. Da oliva a ottone mostra quanto bene il verde scuro accolga un partner metallico caldo. ## Gradienti verde lime elettrico e neon I verdi acidi e lime sono forti e sintetici nel modo migliore. Si adattano a sport, musica, gaming e lanci tech. Su un fondo quasi nero brillano; sul bianco possono essere difficili da guardare, quindi lì usali in aree piccole. - Lime sul nero: `linear-gradient(135deg, #0a0a0a 0%, #1a2e05 50%, #a3e635 100%)` - Da lime a limone: `linear-gradient(135deg, #84cc16 0%, #facc15 100%)` - Alone acido: `radial-gradient(circle at 50% 50%, #bef264 0%, #4d7c0f 45%, #0c1a05 100%)` - Da verde a ciano: `linear-gradient(135deg, #22c55e 0%, #06b6d4 100%)` Verdi elettrici. Solo vicini: nero, giallo e ciano. ## Gradienti verde acqua e giada Il verde che vira al blu è calmo, curato e sicuro di sé senza gridarlo. Funziona bene per finanza, benessere e viaggi, ed è meno atteso del blu puro in quelle categorie. - Verde acqua profondo: `linear-gradient(160deg, #042f2e 0%, #0f766e 55%, #5eead4 100%)` - Da giada ad acqua: `linear-gradient(135deg, #064e3b 0%, #0d9488 50%, #67e8f9 100%)` - Luce di laguna: `linear-gradient(135deg, #134e4a 0%, #2dd4bf 60%, #f0fdfa 100%)` Verde acqua e giada. Stanno tra i verdi qui sopra e i [gradienti blu](https://gradiently.design/it/guide/blue-gradient). ## Evitare il cliché della sostenibilità Poiché il verde è così legato alla natura, è diventato il colore predefinito per tutto ciò che è eco, biologico o sostenibile. Un verde foglia acceso, uno sfondo bianco e un’icona di foglia ora si leggono come la categoria, non come una particolare azienda. Se lavori in quel campo e vuoi farti notare, cambia almeno una di queste tre cose. ### Cliché - Verde foglia acceso su bianco - Verde sfumato solo con altro verde e blu - Foglie, globi e germogli come decorazione - Finitura digitale liscia e lucida ### Fresco - Oliva, bottiglia, salvia o chartreuse - Un partner non naturale: rosa, lilla, crema o nero - Testo e texture invece di icone - Grana da carta o un materiale opaco Verde e rosa sono un abbinamento particolarmente buono per questo, perché la combinazione sa di botanico senza essere letterale. Stanno però quasi agli opposti sulla ruota dei colori, quindi tienili in aree separate invece di sfumare l’uno nell’altro. I [colori complementari](https://gradiently.design/it/guide/complementary-colors) spiegano il perché. Verde bottiglia e rosa, diviso: `linear-gradient(90deg, #0b3b2e 0% 62%, #f4b6c2 62% 100%)` Due opposti affiancati con un bordo netto. Di impatto, botanico e per niente simile a una palette eco da catalogo. ## Testo sui gradienti verdi | Testo su sfondo | Contrasto | Verdetto | | --- | --- | --- | | Bianco su `#14532d` | 9,1:1 | Eccellente | | Bianco su `#15803d` | 5,0:1 | Buono per il testo del corpo | | Bianco su `#16a34a` | 3,3:1 | Solo testo grande | | `#052e16` su `#22c55e` | 6,5:1 | Qui funziona l’inchiostro scuro | | `#052e16` su `#a3e635` | 9,9:1 | Eccellente | | `#052e16` su `#86efac` | 10,6:1 | Eccellente | Rapporti di contrasto WCAG, calcolati. Il testo del corpo richiede 4,5:1, il testo grande 3:1. I verdi accesi sono più chiari di come sembrano, quindi il testo bianco su di essi di solito non passa. Un inchiostro verde molto scuro si legge meglio e tiene tutto nella famiglia. Controlla il punto più chiaro dietro il testo bianco su qualsiasi gradiente; il [testo su un gradiente](https://gradiently.design/it/guide/text-on-gradient) mostra come. Un post verticale in stile appunti intitolato Cosa cresce a ottobre su un gradiente profondo Un campo calmo e profondo per un post editoriale. Una storia verticale con conto alla rovescia con la scritta Mancano 3 giorni su un gradiente acceso Una storia con un conto alla rovescia deciso, dove un verde elettrico brillerebbe. ```css .panel { background-color: #0b3b2e; background-image: linear-gradient(180deg, #03140e 0%, #0b3b2e 55%, #1f6f50 100%); color: #f5f0e6; } ``` Verde bottiglia con testo crema caldo: un abbinamento facile e premium. Per altre palette tratte da foreste, campi e acqua, vedi le [palette di colori dalla natura](https://gradiently.design/it/guide/nature-color-palettes). ## FAQ ### Quali colori stanno bene con il verde in un gradiente? Verde acqua, blu, giallo e lime sfumano in modo pulito con il verde. Rosa, rosso e viola sono partner di impatto ma devono stare in aree separate, perché sfumare il verde in essi lo rende grigio. ### Qual è il CSS per un gradiente verde scuro? Per esempio, linear-gradient(180deg, #03140e 0%, #0b3b2e 55%, #1f6f50 100%) dà un verde bottiglia profondo. Ogni palette di questa pagina si può copiare come CSS. ### Che colore di testo funziona sul verde? Bianco o crema funzionano sui verdi profondi. Sui verdi accesi o chiari usa un inchiostro verde molto scuro, perché il testo bianco di solito scende sotto il contrasto consigliato. ### Come uso il verde senza sembrare un brand eco? Scegli verdi meno attesi come oliva, bottiglia o chartreuse, abbinali a un colore non naturale come rosa o lilla e usa texture o testo invece dei motivi a foglia.