# Sfumatura argento: codici metallici e come illuminarli

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

Ciò che separa l’argento dal semplice grigio è la luce. Ecco sei sfumature argento da copiare, le quattro regole che le fanno leggere come metallo e il CSS per testi, pulsanti e superfici spazzolate.

## The short version

- Una sfumatura argento si legge come metallo e non come grigio quando unisce una leggera tinta fredda, un’ampia gamma dallo scuro al chiaro e una luce stretta e brillante.
- L’argento lucido ha transizioni nette e forte contrasto, l’argento satinato ha transizioni morbide e l’argento spazzolato aggiunge sottili linee parallele.
- I grigi neutri puri tendono a sembrare piatti e polverosi, quindi la maggior parte degli argenti convincenti vira appena verso il blu o, per platino e peltro, appena verso il caldo.
- Le sfumature di grigio lunghe e sottili sono particolarmente soggette a banding, che uno strato di grana fine nasconde.
- Le sfumature argento funzionano meglio su testi, bordi, pulsanti e piccole forme, su fondo scuro.

Una **sfumatura argento** sembra metallo quando ha tre cose che al grigio semplice mancano: una lieve tinta fredda, un grande salto tra il punto più scuro e il più chiaro e una luce stretta invece che diffusa. Un codice affidabile da cui partire è `linear-gradient(135deg, #5f6670, #c9cfd6, #f7f9fb, #a7afb9, #4b525c)`. Qui sotto trovi sei argenti da copiare, le regole di illuminazione che li reggono e il CSS per testo argento, pulsanti e metallo spazzolato.

## Codici per sfumature argento

- Argento lucido: `linear-gradient(135deg, #5f6670 0%, #c9cfd6 28%, #f7f9fb 44%, #a7afb9 58%, #4b525c 82%, #9aa2ac 100%)`
- Argento satinato: `linear-gradient(160deg, #8d939b 0%, #c3c8ce 35%, #e4e7ea 55%, #b5bbc2 75%, #8a9098 100%)`
- Argento spazzolato: `repeating-linear-gradient(90deg, #b9bec5 0px, #d3d7dc 1px, #aeb3ba 2px, #c8ccd2 4px)`
- Platino freddo: `linear-gradient(135deg, #6f7680 0%, #d6dce4 30%, #fbfdff 45%, #b9c3cf 60%, #56606c 100%)`
- Peltro caldo: `linear-gradient(135deg, #4f4c48 0%, #a39f99 30%, #e3e0da 46%, #9b968f 62%, #4a4743 100%)`
- Luce argento su nero: `radial-gradient(ellipse at 30% 20%, #e9edf1 0%, #8f97a1 22%, #2b3038 52%, #0c0e11 85%)`

Sei argenti: quattro per testi, bordi e forme, una superficie spazzolata e uno sfondo. Ognuno ha un punto scuro e una luce quasi bianca.

- Acciaio in ombra: #4b525c
- Canna di fucile: #5f6670
- Argento: #a7afb9
- Argento chiaro: #c9cfd6
- Luce: #f7f9fb

I codici colore dell’argento dietro l’Argento lucido. Ognuno vira appena verso il blu, ed è per questo che si legge come metallo e non come cemento.

## Come illuminare una sfumatura argento

L’argento, come ogni metallo lucido, mostra soprattutto luce riflessa. La tua sfumatura è un riflesso dipinto, quindi pensa da dove viene la luce e con quanta nettezza la superficie la cattura.

1. **Tingi i grigi di un lieve freddo** Aggiungi un tocco di blu a ogni punto, quanto basta perché il grigio non sembri più polvere o cemento.
2. **Scurisci più di quanto sembri giusto** Il metallo ha bisogno di un’ombra profonda. Il tuo punto più scuro dovrebbe essere un grigio canna di fucile, non un grigio medio.
3. **Tieni la luce stretta** Una fascia quasi bianca che copre una piccola fetta della sfumatura si legge come lucentezza. Un’ampia area chiara si legge come una superficie di grigio pallido.
4. **Decidi: lucido o satinato** Avvicina i punti per un argento lucido con riflessi nitidi; allargali per una finitura satinata e morbida.

Spingi il contrasto al massimo, con una linea d’orizzonte netta al centro, e l’argento diventa cromo a specchio; l’[effetto testo cromato](https://gradiently.design/it/guide/chrome-effect) tratta quella versione. Per un metallo caldo con la stessa logica, vedi la [sfumatura oro](https://gradiently.design/it/guide/gold-gradient-design).

## Argento contro grigio semplice

### Si legge come grigio

- Grigi perfettamente neutri
- Due punti, da grigio chiaro a grigio medio
- Solo transizioni uniformi e dolci
- Un’ampia area pallida senza una luce chiara
- Grandi aree piatte d’argento su una pagina bianca

### Si legge come argento

- Grigi con una lieve tinta fredda o calda
- Cinque o sei punti, da canna di fucile a quasi bianco
- Un riflesso più netto da qualche parte
- Una luce stretta e brillante fuori centro
- Dettagli argento su fondo scuro

Se invece vuoi una calma superficie neutra e non il metallo, è un altro lavoro: [sfumatura grigia](https://gradiently.design/it/guide/grey-gradient) e [sfumatura monocromatica](https://gradiently.design/it/guide/monochrome-gradient) trattano grigi morbidi e tonali per gli sfondi.

## Quale finitura d’argento usare

Ogni finitura dice qualcosa di leggermente diverso, quindi sceglila per il compito e non per abitudine. Un brand può usarne tranquillamente due, per esempio argento lucido per un logo e argento spazzolato per i pannelli della confezione, purché la tinta resti la stessa.

| Finitura | Aspetto | Usala per |
| --- | --- | --- |
| Lucido | Riflessi nitidi, forte contrasto, luce stretta e brillante | Loghi, titoli, grafiche per premi |
| Satinato | Transizioni morbide, lucentezza delicata, poco contrasto | Grandi superfici, confezioni, sfondi quieti |
| Spazzolato | Sottili linee parallele sotto una lucentezza morbida | Pannelli, pagine prodotto, brand tecnici |
| Platino | Freddo, brillante, luce quasi bianca | Livelli premium, anniversari, gioielli |
| Peltro | Più scuro, più caldo, più morbido | Tradizione, artigianato, moda uomo |

Cinque finiture d’argento e dove sta bene ciascuna. Tutte nascono dalle stesse regole di luce; cambiano solo contrasto, tinta e spaziatura dei punti.

## Testo e pulsanti argento in CSS

```css
.silver-text {
  font-weight: 800;
  font-size: clamp(2.5rem, 8vw, 6rem);
  color: #a7afb9; /* fallback */
  background: linear-gradient(
    135deg,
    #5f6670 0%, #c9cfd6 28%, #f7f9fb 44%,
    #a7afb9 58%, #4b525c 82%, #9aa2ac 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.silver-button {
  padding: 0.85rem 1.6rem;
  border: 1px solid #4b525c;
  border-radius: 999px;
  color: #1c2026;
  font-weight: 600;
  background: linear-gradient(180deg, #f7f9fb 0%, #c9cfd6 48%, #a7afb9 52%, #d9dee3 100%);
  box-shadow: inset 0 1px 0 #ffffff, 0 2px 4px rgb(0 0 0 / 0.25);
  cursor: pointer;
}

.silver-button:hover {
  background: linear-gradient(180deg, #ffffff 0%, #d6dbe0 48%, #b3bac3 52%, #e3e7eb 100%);
}

.brushed {
  background:
    repeating-linear-gradient(90deg, #b9bec5 0px, #d3d7dc 1px, #aeb3ba 2px, #c8ccd2 4px);
}
```

Testo di titolo argento, un pulsante a pillola con riflesso diviso e un pannello di metallo spazzolato. Il testo scuro del pulsante mantiene leggibile l’etichetta.

Il pulsante usa un salto a metà, dal 48% al 52%, che si legge come un orizzonte riflesso in una superficie curva. [CSS per pulsanti con sfumatura](https://gradiently.design/it/guide/css-gradient-button) ha altri schemi di pulsanti, e il [testo con sfumatura](https://gradiently.design/it/guide/css-gradient-text) spiega il ritaglio del testo e il suo supporto tra i browser.

> **I grigi fanno banding facilmente** Le sfumature di grigio lunghe e sottili sono dove il banding si vede di più, soprattutto dopo che una piattaforma comprime l’immagine. Aggiungi uno strato di grana fine ed esporta in PNG a dimensione piena. Il [banding nelle sfumature](https://gradiently.design/it/guide/gradient-banding) spiega perché.

## Progettare con l’argento

L’argento si legge come moderno, freddo e preciso, dove l’oro si legge come caldo e tradizionale. Si adatta a lanci tecnologici, orologi e gioielli, anniversari (l’argento è il tradizionale 25°), campagne invernali e tutto ciò che ha un tocco futurista. Come l’oro, sembra più prezioso in piccole dosi su fondo scuro: un monogramma, un filetto sottile, un solo titolo.

Un invito verticale per nozze d’argento con luce fredda e metallica e le parole Venticinque anni

Un invito per un anniversario in cui una luce fredda e metallica porta il tema e le parole restano calme.

Un post verticale di prodotto che annuncia un orologio in acciaio su uno sfondo scuro e freddo

Un post di prodotto per un orologio: una superficie scura e fredda con l’argento come luce, non come riempimento grigio piatto.

L’argento sta bene anche con azzurri ghiaccio e blu notte profondo per una palette invernale, e con nero e bianco per un aspetto netto ed editoriale. [Palette di colori di lusso](https://gradiently.design/it/guide/luxury-color-palettes) ha diverse combinazioni costruite sui metalli freddi. Nello Studio di Gradiently, un Mark metallico freddo viene reso dal vivo dietro le tue parole a ogni dimensione, e l’inchiostro automatico sceglie testo chiaro o scuro per ogni riga dalla palette del Mark stesso, così le superfici argento restano leggibili senza che tu controlli ogni formato.

## FAQ

### Qual è un buon codice per una sfumatura argento?

Prova `linear-gradient(135deg, #5f6670, #c9cfd6, #f7f9fb, #a7afb9, #4b525c)`. Va dal grigio canna di fucile all’argento chiaro fino a una luce quasi bianca e ritorno.

### Quali codici esadecimali danno un argento metallico?

Una combinazione come #4b525c, #5f6670, #a7afb9, #c9cfd6 e #f7f9fb. Ognuno vira appena verso il blu, il che evita che sembri un grigio semplice.

### Come faccio un effetto metallo spazzolato in CSS?

Usa una sfumatura lineare ripetuta con punti minuscoli a uno o due pixel di distanza in grigi vicini, come `repeating-linear-gradient(90deg, #b9bec5 0px, #d3d7dc 1px, #aeb3ba 2px, #c8ccd2 4px)`.

### Perché la mia sfumatura argento sembra grigia?

Probabilmente mancano contrasto e una luce. Aggiungi un punto più scuro canna di fucile, una fascia stretta quasi bianca e una lieve tinta fredda a ogni punto.

### Che differenza c’è tra sfumature argento e platino?

Nel design il platino è di solito un argento leggermente più freddo e brillante con una luce più bianca, mentre il peltro è un grigio argento più scuro e caldo.

### Che colore di sfondo fa risaltare di più l’argento?

Fondi scuri come nero, carbone, blu notte profondo o blu mezzanotte. L’argento su bianco o grigio chiaro perde la sua luce e tende a sembrare piatto e slavato.