# Colori gemma: codici di smeraldo, zaffiro, rubino e ametista

[Canonical HTML page](https://gradiently.design/it/guide/jewel-tone-colors)

Smeraldo, zaffiro, rubino e ametista sembrano preziosi perché sono profondi e saturi insieme. Ecco i codici, gli abbinamenti che li mantengono ricchi e gli errori che li fanno sembrare un costume.

## The short version

- I colori gemma sono tonalità profonde e molto sature che prendono il nome dalle gemme: verde smeraldo, blu zaffiro, rosso rubino, viola ametista, più topazio, citrino, granato e tormalina.
- Ciò che rende un colore una tonalità gemma è la combinazione di forte saturazione e valore da medio a scuro, così sembra illuminato dall’interno e non brillante o pallido.
- I colori gemma danno il meglio accanto a un neutro caldo come l’avorio, a un quasi nero o a una piccola dose di oro spento.
- Smeraldo, zaffiro, rubino e ametista superano tutti il contrasto WCAG AA per il testo corrente su bianco o avorio, con i codici di questo articolo.
- Usa un colore gemma come protagonista e al massimo un altro come accento, perché un set completo di pietre alla stessa intensità sembra un costume.

I **colori gemma** sono tonalità profonde e sature che prendono il nome dalle pietre preziose: smeraldo `#00674F`, zaffiro `#0F52BA`, rubino `#9B111E` e ametista `#6A3D9A` sono i quattro che tutti riconoscono, seguiti da vicino da topazio, citrino, granato e tormalina. Stanno in una fascia stretta: molto più ricchi dei pastelli, più scuri del neon e mai spenti come le terre. Questa combinazione è il motivo per cui sembrano preziosi e per cui si adattano a eventi serali, campagne invernali, etichette di vino e a qualsiasi brand voglia dare un’idea di sostanza senza passare al nero.

## Codici esadecimali dei colori gemma

Sono codici pronti all’uso, calibrati per somigliare alla pietra su schermo e per reggere come testo. Le gemme variano, quindi non esiste uno smeraldo ufficiale, ma questi valori stanno nel pieno di ciò che la gente immagina.

- Smeraldo: #00674f
- Zaffiro: #0f52ba
- Rubino: #9b111e
- Ametista: #6a3d9a
- Topazio: #d98e04
- Citrino: #e1b000
- Granato: #6f1d2b
- Tormalina: #b0185a
- Tormalina turchese: #0e7c7b

Nove colori gemma. I primi quattro sono il set classico; topazio e citrino sono i membri caldi e chiari della famiglia.

| Colore gemma | Esadecimale | RGB | Testo su bianco |
| --- | --- | --- | --- |
| Smeraldo | `#00674F` | 0, 103, 79 | 6,88:1, supera AA |
| Zaffiro | `#0F52BA` | 15, 82, 186 | 7,15:1, supera AAA |
| Rubino | `#9B111E` | 155, 17, 30 | 8,42:1, supera AAA |
| Ametista | `#6A3D9A` | 106, 61, 154 | 7,64:1, supera AAA |
| Tormalina turchese | `#0E7C7B` | 14, 124, 123 | 5,01:1, supera AA |
| Tormalina | `#B0185A` | 176, 24, 90 | 6,72:1, supera AA |
| Topazio | `#D98E04` | 217, 142, 4 | usa testo scuro |
| Citrino | `#E1B000` | 225, 176, 0 | usa testo scuro |

Il contrasto è misurato rispetto al bianco puro. Topazio e citrino sono troppo chiari per il testo su bianco, ma reggono bene il testo quasi nero: il citrino con `#14141A` arriva a 9,10:1.

Se ti servono in un altro formato, [i codici colore esadecimali](https://gradiently.design/it/guide/color-codes-explained) spiegano il rapporto tra esadecimale, RGB e HSL, e [da esadecimale a RGB](https://gradiently.design/it/guide/hex-to-rgb) mostra la conversione a mano.

## Cosa rende un colore una tonalità gemma

Due regolazioni, entrambe insieme. La saturazione è alta: il colore è puro, con quasi nessun grigio. Il valore è da medio a scuro: sta ben sotto il bianco. Alza il valore e lo smeraldo diventa menta; abbassa la saturazione e diventa salvia. Mantieni entrambi e ottieni il bagliore della luce che attraversa una pietra tagliata.

### Non è un colore gemma

- Menta `#98E5C8`: troppo chiaro, un pastello
- Salvia `#8A9A84`: spento, un tono smorzato
- Lime `#7CFF3A`: acceso ed elettrico, un neon
- Verde bosco `#1F3B2C`: così scuro da sembrare quasi nero

### Colore gemma

- Smeraldo `#00674F`: verde puro a un valore medio scuro
- Zaffiro `#0F52BA`: blu saturo, chiaramente illuminato
- Rubino `#9B111E`: rosso profondo che brilla ancora
- Ametista `#6A3D9A`: viola con profondità, non grigio

È la stessa idea descritta da [tinte, toni e sfumature](https://gradiently.design/it/guide/tints-tones-shades): i colori gemma sono per lo più tinte pure con un po’ di nero, di rado con bianco o grigio. Stanno anche all’estremo opposto dei [colori terra](https://gradiently.design/it/guide/earth-tone-colors), che sono le stesse tinte tirate verso il marrone.

## Palette di colori gemma da usare

Un colore gemma ha bisogno di qualcosa di tranquillo intorno. Da solo, una pagina di smeraldo è pesante; accanto all’avorio sembra voluta. Ognuna di queste quattro palette parte da una pietra e aggiunge il supporto nella proporzione giusta.

- **Biblioteca smeraldo:** smeraldo `#00674F`, avorio `#F6EFE2`, oro spento `#C9A24A`, inchiostro `#14141A`. Classica, da libreria, ottima per editori e bar.
- **Notte zaffiro:** zaffiro `#0F52BA`, mezzanotte `#0B1430`, perla `#EEF0F5`, citrino `#E1B000` come piccolo accento. Calma e sicura.
- **Cena rubino:** rubino `#9B111E`, granato `#6F1D2B`, crema `#F4EADB`, oliva `#5E6B3A`. Calda, generosa, fatta per cibo e vino.
- **Studio ametista:** ametista `#6A3D9A`, prugna `#3B1F4F`, lino `#F2ECE4`, tormalina turchese `#0E7C7B`. Creativa e un po’ inattesa.

Usa la [regola 60 30 10](https://gradiently.design/it/guide/60-30-10-rule) come ripartizione di partenza: il neutro copre gran parte della superficie, il colore gemma prende le forme grandi e l’accento una sottile striscia. L’oro funziona meglio spento; un oro giallo acceso accanto allo smeraldo sembra subito un costume.

## Sfumati con i colori gemma

I colori gemma danno alcuni degli sfumati più ricchi che esistano, perché ognuno può sfumare nella propria ombra senza diventare fangoso. Tieni vicini sulla ruota dei colori i colori adiacenti e lascia che sia uno sfondo scuro a fare gran parte del lavoro.

- Profondità smeraldo: `radial-gradient(circle at 30% 25%, #10a37f 0%, #00674f 40%, #052a22 85%)`
- Alba zaffiro: `linear-gradient(150deg, #0b1430 0%, #0f52ba 60%, #4f86e6 100%)`
- Bagliore rubino: `radial-gradient(circle at 70% 30%, #d4243a 0%, #9b111e 40%, #3a0710 90%)`
- Da ametista a tormalina: `linear-gradient(160deg, #1e0f33 0%, #6a3d9a 55%, #b0185a 100%)`
- Da smeraldo a zaffiro: `linear-gradient(135deg, #00674f 0%, #0e7c7b 50%, #0f52ba 100%)`
- Citrino sul granato: `radial-gradient(circle at 50% 20%, #e1b000 0%, #d98e04 30%, #6f1d2b 95%)`

Sei sfumati con i colori gemma. Ognuno resta entro tinte vicine, così il centro della miscela resta pulito.

Evita di sfumare il rubino direttamente nello smeraldo. Sono complementari, quindi il punto medio diventa marrone; [gli sfumati fangosi](https://gradiently.design/it/guide/muddy-gradients) spiegano perché e come aggirare il problema passando per un terzo colore o per uno sfondo scuro.

## Dove i colori gemma funzionano meglio

I colori gemma hanno peso, quindi si adattano ai momenti che devono sembrare curati: un invito, un menù stagionale, la copertina di un bilancio annuale, il lancio di qualcosa che costa davvero. Componi il testo in avorio o in una tinta chiara della stessa tonalità e mantieni il layout sobrio.

Un invito verticale per una cena invernale con scritte chiare su uno sfondo profondo e ricco

Un invito 5×7 in a 1500×2100. Uno sfondo profondo con testo chiaro è la mossa classica dei colori gemma.

Un post social verticale che annuncia un prodotto in edizione limitata rubino su uno sfondo colorato profondo

Un post Instagram 1080×1350 per un prodotto in edizione limitata, in cui una sola pietra crea l’atmosfera.

Molti brand scelgono i colori gemma in autunno e in inverno, ed è proprio per questo che una campagna stagionale può confondersi con quelle di tutti gli altri. Se vuoi la ricchezza senza l’omologazione, un Mark di Gradiently ti dà uno sfondo nei toni gemma con cui puoi esportare solo tu, una volta riservato, e mantiene leggibili le tue parole ovunque si trovino.

## Errori comuni con i colori gemma

- **Usare quattro pietre a piena intensità.** Smeraldo, zaffiro, rubino e ametista insieme sembrano una scatola di caramelle. Scegline una come protagonista.
- **Abbinarli al bianco puro.** Dà contrasto ma sembra clinico. Un avorio caldo fa sembrare il colore più profondo.
- **Mettere colori gemma chiari sotto testo bianco.** Citrino e topazio vogliono testo scuro; il bianco sul citrino fallisce nettamente il contrasto.
- **Stampare senza una prova.** Blu e viola saturi spesso escono dalla gamma CMYK e si spengono sulla carta. Leggi [RGB e CMYK](https://gradiently.design/it/guide/rgb-vs-cmyk) prima di inviare un file.

## FAQ

### Cosa sono i colori gemma?

I colori gemma sono tonalità profonde e sature che prendono il nome dalle pietre preziose, come verde smeraldo, blu zaffiro, rosso rubino e viola ametista. Uniscono forte saturazione e valore da medio a scuro.

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

Un buono smeraldo da colore gemma è `#00674F`. Smeraldi più chiari come `#50C878` sono comuni sul web, ma sembrano un verde medio brillante più che una gemma.

### Quali colori stanno bene con i colori gemma?

Neutri caldi come avorio e crema, quasi nero e piccole dosi di oro spento. Un colore gemma di solito sta meglio con al massimo un altro colore gemma, usato come accento.

### Che differenza c’è tra colori gemma e colori terra?

I colori gemma sono puri e saturi; i colori terra sono le stesse tinte tirate verso il marrone e il grigio. Lo smeraldo è un colore gemma, l’oliva è un colore terra.

### I colori gemma vanno bene per un brand?

Si adattano ai brand che vogliono sembrare ricchi, affermati o celebrativi, come ospitalità, editoria e prodotti premium. Scegli una pietra come protagonista e lascia molto spazio neutro intorno.