# Foto duotone nei colori del brand: mono, duotone e velatura

[Canonical HTML page](https://gradiently.design/it/guide/photo-duotone-in-mark-colours)

Foto che non si accordano sono il modo più rapido per far sembrare un feed preso in prestito. Virarle nei tuoi colori unisce foto stock, scatti col telefono e foto di prodotto in un’unica famiglia.

## The short version

- Una foto duotone sostituisce i toni di un’immagine con due colori: uno per le ombre e uno per le luci.
- In Gradiently qualsiasi foto può essere virata in mono, duotone o velatura, e duotone e velatura prendono i colori dal Mark del design.
- Virare le foto negli stessi colori dello sfondo fa sembrare un unico insieme voluto fonti miste, dalle foto stock agli scatti col telefono.
- Le foto si possono anche regolare per luce e colore, rifinire con filtri come Film o Noir e ritagliare ad arco, cerchio e macchia.
- Ogni regolazione delle foto resta modificabile, così puoi cambiare la tinta o sostituire il Mark in seguito e la foto lo segue.

Una **foto duotone** scambia i colori naturali di un’immagine con due colori scelti: un colore scuro per le ombre e uno chiaro per le luci, con tutti i toni intermedi fusi dalla coppia. Fatta nei colori del tuo brand, trasforma qualsiasi fotografia in qualcosa che appartiene chiaramente a te. In Gradiently puoi virare una foto in tre modi, mono, duotone o velatura, e duotone e velatura prendono i colori direttamente dal Mark del design, così foto e sfondo concordano sempre.

## Come funziona una foto duotone

Pensa prima alla foto in bianco e nero. Ogni pixel ha una luminosità da 0 a 100 per cento. Un duotone poi dipinge i pixel più scuri con il tuo colore d’ombra, i più chiari con il tuo colore di luce e tutto il resto nel punto corrispondente lungo la rampa tra i due. Il risultato conserva tutti i dettagli della foto, ma nessuno dei suoi colori originali.

- Da indaco a rosa tenue: `linear-gradient(90deg, #1e1b4b 0%, #be185d 55%, #fbcfe8 100%)`
- Da verde petrolio profondo a sabbia: `linear-gradient(90deg, #052e2b 0%, #0f766e 50%, #f5d0a9 100%)`
- Da rosso bue a burro: `linear-gradient(90deg, #2b0a0a 0%, #b45309 55%, #fde68a 100%)`
- Da blu navy a ghiaccio: `linear-gradient(90deg, #0b1020 0%, #2563eb 55%, #e0f2fe 100%)`

Quattro rampe duotone. Le ombre prendono il colore a sinistra, le luci il colore a destra, e i toni medi della foto finiscono nel mezzo.

Il trucco che fa un duotone bello invece che sporco è il contrasto tra i due estremi. Un’ombra molto scura e una luce molto chiara mantengono leggibili volti e prodotti. Due toni medi producono un’immagine piatta e torbida. Per la storia e gli usi più ampi di questo look, vedi [l’effetto duotone](https://gradiently.design/it/guide/duotone-effect).

## Mono, duotone e velatura: tre modi di virare

| Tinta | Cosa fa | Colori da | Quando usarla |
| --- | --- | --- | --- |
| **Mono** | Rende la foto in bianco e nero | Grigi neutri | Ritratti, citazioni, tutto ciò che è serio o senza tempo |
| **Duotone** | Mappa ombre e luci su due colori | Il Mark | Post decisi, locandine di eventi, foto di team che non si accordano |
| **Velatura** | Stende il colore del Mark sulla foto conservando parte del suo | Il Mark | Foto di prodotto e cibo, dove il soggetto deve restare reale |
| Nessuna | Lascia stare il colore della foto | La foto | Foto di prodotto principali dove conta il colore fedele |

Le opzioni di tinta nella modifica delle foto. Duotone e velatura usano i colori del tuo Mark, quindi cambiare il Mark vira di nuovo la foto.

Un post verticale intitolato Conosci il team con la riga di dettaglio su cinque persone e una macchina espresso, su un Mark sfumato caldo

Il tipo di post che un duotone salva: foto del team scattate con telefoni diversi, riunite in un unico insieme dai colori del Mark.

Un post verticale di prodotto che annuncia una miscela di caffè autunnale sullo stesso Mark sfumato

Un post di prodotto: il caso in cui una velatura delicata lega la foto allo sfondo ma lascia che il caffè sembri caffè.

## Come fare una foto duotone in Gradiently

1. **Aggiungi la foto** Carica o incolla la tua, oppure scegline una tra le foto stock gratuite nello Studio.
2. **Apri la modifica della foto** Seleziona la foto e apri il suo pannello di modifica, dove stanno luce, colore, filtri e tinta.
3. **Scegli Duotone sotto i colori del Mark** La foto viene rimappata subito sulla palette del Mark. Prova anche Velatura e Mono; confrontare non costa nulla.
4. **Imposta il contrasto** Alza il contrasto se il risultato sembra piatto, e la luminosità se i volti cadono nel colore d’ombra.
5. **Ritaglia in una forma** Inquadrala come quadrato, cerchio, arco o macchia per adattarla all’impaginazione.
6. **Cambia il Mark per provare** Cambia il Mark del design e la tinta lo segue, così puoi provare diversi look sulla stessa foto.

> **Tutto resta modificabile** Tinte e filtri non si fondono mai nella foto. Puoi cambiarli o azzerarli in qualsiasi momento, il che conta quando una campagna cambia colore a metà strada.

## Filtri, luce e colore per la finitura

La tinta stabilisce la famiglia di colore; le altre regolazioni decidono la sensazione. Sono in tre gruppi, e i preset sono un modo rapido per partire prima di affinare. Se la foto è di prodotto, sistema prima lo sfondo: [gli sfondi per foto di prodotto](https://gradiently.design/it/guide/product-photo-backgrounds) lo tratta.

| Gruppo | Controlli | Cosa usare |
| --- | --- | --- |
| Luce | Luminosità, contrasto | Prima il contrasto per qualsiasi duotone; separa i due colori |
| Colore | Saturazione, temperatura, da verde a magenta, tinta | Temperatura per scaldare o raffreddare una velatura; lascia stare la saturazione su un duotone |
| Finitura | Sfocatura, vignettatura | Una vignettatura leggera porta l’occhio verso l’interno nei ritratti |
| Preset | Originale, Vivido, Morbido, Caldo, Freddo, Sbiadito, Noir, Film | Film o Sbiadito sotto una velatura dà facilmente un senso di stampato |

I controlli di modifica delle foto. Parti da un preset, poi regola la luce prima del colore.

## Forme di ritaglio: archi, cerchi e macchie

Una foto virata in una forma morbida sembra progettata e non lasciata cadere lì. Gli archi sono architettonici e calmi, bellissimi per interni, fioristi e matrimoni, e adatti al [branding del fotografo](https://gradiently.design/it/guide/photographer-branding). I cerchi vanno bene per le persone: pagine del team, relatori, testimonianze. Le macchie sono giocose e stanno bene su cibo, brand per bambini e tutto ciò che è informale. Resta su una forma per design così l’insieme appare coerente.

### Da evitare

- Due colori di tono medio che rendono grigia la foto
- Un duotone sull’unica foto in cui il colore vero vende, come un vestito
- Una tinta diversa su ogni foto di un carosello
- Parole sulla parte più affollata della foto

### Da fare

- Un colore d’ombra profondo e una luce pallida
- Una velatura per i prodotti, duotone per persone e luoghi
- Una sola tinta su ogni foto di un insieme
- Parole nell’area calma, con l’inchiostro automatico che sceglie il colore

Se il testo sta sulla foto stessa, [rendere leggibile il testo sulle foto](https://gradiently.design/it/guide/readable-text-on-photos) tratta il posizionamento, e una tinta coerente è una delle abitudini più semplici dietro la [coerenza del brand](https://gradiently.design/it/guide/brand-consistency).

## Un duotone in CSS

Su un sito web puoi ottenere lo stesso effetto con le modalità di fusione: rendi la foto in scala di grigi, moltiplicala sul colore di luce, poi schiariscila con il colore d’ombra.

```css
.duotone {
  position: relative;
  background: #fbcfe8; /* highlight colour */
}

.duotone img {
  display: block;
  width: 100%;
  filter: grayscale(1) contrast(1.1);
  mix-blend-mode: multiply;
}

.duotone::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #1e1b4b; /* shadow colour */
  mix-blend-mode: lighten;
  pointer-events: none;
}
```

Ombre indaco e luci rosa tenue. Vedi [mix-blend-mode su MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode) per il supporto dei browser.

## FAQ

### Che cos’è una foto duotone?

Una foto i cui colori sono sostituiti da due: uno per le ombre e uno per le luci, con i toni intermedi fusi dalla coppia.

### Come faccio una foto duotone nei colori del mio brand?

In Gradiently seleziona la foto, apri la modifica della foto e scegli Duotone; usa i colori del Mark del design. In CSS, combina un’immagine in scala di grigi con le modalità di fusione.

### Qual è la differenza tra duotone e velatura di colore?

Un duotone sostituisce tutto il colore della foto con due colori. Una velatura stende un colore sulla foto conservando parte del suo, così i soggetti restano naturali.

### Quali colori fanno un buon duotone?

Un colore d’ombra molto scuro e un colore di luce molto chiaro. Due toni medi rendono la foto piatta e torbida.

### Posso ritagliare le foto in forme in Gradiently?

Sì. Le foto si possono inquadrare come quadrati, cerchi, archi o macchie.