Contagocce colore

Devi scoprire il colore esatto di un logo, di una foto o di uno screenshot? Carica l’immagine, passa il mouse sul punto che ti interessa e clicca. Il codice del colore finisce subito negli appunti nel formato che scegli: HEX, RGB, HSL, HSV o LCH. Non installi nulla e l’immagine non lascia il tuo computer.

Come trovare il colore di un’immagine

1. Carica un’immagine. Trascinala nella finestra o clicca su “Sfoglia file”. Il contagocce legge JPG, PNG, WebP e GIF.
2. Scegli il formato. Sopra l’immagine seleziona in che notazione vuoi copiare il colore. Per il web di solito serve HEX, per i programmi grafici RGB. Lo strumento ricorda la tua scelta.
3. Passa sopra al colore. Vicino al cursore compare una lente con i pixel circostanti ingranditi e sotto il codice del colore.
4. Clicca. Il codice è negli appunti e il colore viene salvato tra i Colori scelti. Ti basta incollarlo dove serve.

Vuoi provare un’altra immagine? Trascinala direttamente su quella attuale, oppure eliminala con l’icona del cestino.

Cosa sa fare il contagocce online

Una lente che mostra ogni pixel

Un contagocce qualunque mostra solo il colore sotto il cursore, e centrare il bordo sottile di una lettera diventa una lotteria. La nostra lente ingrandisce l’area intorno al cursore a 11 × 11 pixel e incornicia quello centrale. Vedi esattamente cosa stai per cliccare, prima di cliccarlo.

Zoom fino al singolo pixel

Con i pulsanti più e meno, o con la rotella del mouse tenendo premuto Ctrl, ingrandisci l’immagine fino a 64 volte. Con la Griglia attiva vedi i bordi dei pixel, così su icone, pixel art o testo minuscolo clicchi esattamente dove vuoi.

Colore dall’originale, non da un’anteprima ridotta

Molti strumenti online rimpiccioliscono prima l’immagine e leggono il colore dall’anteprima, dove i pixel vicini si mescolano tra loro. Il nostro contagocce lavora sull’immagine a piena risoluzione (fino a 4096 px sul lato più lungo), quindi ottieni il colore reale del pixel.

Copia con un clic

Niente selezione di testo né numeri da ricopiare a mano. Ogni clic sull’immagine copia il codice nel formato scelto. Se ti serve lo stesso colore anche in un’altra notazione, il dettaglio del colore mostra tutti e cinque i formati, ciascuno con il proprio pulsante di copia.

Palette dei colori dominanti

Appena carichi l’immagine, lo strumento trova fino a otto colori che la dominano e li mostra tra i Colori dominanti. Le tonalità quasi identiche vengono unite, così la palette non contiene cinque varianti di grigio, e le parti trasparenti di un PNG vengono ignorate. La palette è un buon punto di partenza per lo schema colori di un sito, di una presentazione o di un post sui social. Se vuoi verificare che i colori mantengano abbastanza contrasto anche senza tonalità, prova a convertire l’immagine in scala di grigi.

Colori scelti sempre sotto controllo

Ogni colore su cui clicchi viene salvato tra i Colori scelti (gli ultimi 24). Puoi così confrontare più punti dell’immagine e tornarci in qualsiasi momento. Su schermo grande il pannello dei colori sta proprio accanto all’immagine.

A cosa serve trovare il codice colore di un’immagine

• Web e app: il cliente ti ha mandato il logo solo in JPG e ti serve il colore esatto del brand per il CSS. Se ti serve anche una versione con sfondo trasparente, usa la rimozione dello sfondo da un’immagine.
• Grafica e social media: vuoi che il testo di un post si abbini alla foto. Prendi il colore direttamente da lì.
• Presentazioni e documenti: imposti i colori del logo aziendale in PowerPoint, Google Slides o Canva usando HEX o RGB.
• Controllo di un progetto: su uno screenshot verifichi se un pulsante dell’app usa davvero il colore previsto dal design. Poi controlli le dimensioni dei file esportati con l’analizzatore delle dimensioni immagine.
• Interni e moda: hai la foto di un tessuto o di una parete e cerchi una tonalità simile. Il codice è un buon punto di partenza quando sfogli un campionario.

Formati colore che il contagocce restituisce

• HEX (#1373b6): la notazione usata in HTML, CSS e nella maggior parte degli strumenti grafici.
• RGB (rgb(19, 115, 182)): la quantità di rosso, verde e blu, ciascuno da 0 a 255. Come funziona la mescolanza additiva dei colori lo spiega Wikipedia.
• HSL (hsl(205, 81%, 39%)): tonalità, saturazione e luminosità. Comodo per creare una variante più chiara o più scura.
• HSV: tonalità, saturazione e valore, come lo conosci dalla selezione colore di Photoshop o GIMP. La differenza tra HSL e HSV la spiega nel dettaglio Wikipedia.
• LCH: un modello che corrisponde a come l’occhio umano percepisce i colori. Viene copiato nella sintassi che il CSS moderno capisce (vedi la documentazione MDN, in inglese).

Il contagocce ti dice quale colore c’è nell’immagine. Se poi vuoi affinarlo, convertirlo in altri formati o trovare tonalità che si abbinano, prosegui verso la ruota dei colori.

Domande frequenti

La mia immagine viene caricata su un server?

No. L'immagine viene letta ed elaborata direttamente nel tuo browser, non viene inviata da nessuna parte e dopo aver chiuso la pagina non resta nulla. Puoi quindi usare il contagocce anche su materiali interni o progetti non ancora pubblicati.

Come trovo il codice HEX di un colore in una foto?

Carica la foto, lascia selezionato il formato HEX sopra l'immagine e clicca sul punto con il colore che cerchi. Il codice, ad esempio #75dab2, è subito negli appunti.

Perché il colore di una foto è diverso dalla realtà?

La fotocamera altera i colori con l'illuminazione, il bilanciamento del bianco e la compressione. Il contagocce restituisce esattamente il colore salvato nel file. Con le foto conviene quindi cliccare su più punti e confrontarli tra i Colori scelti. Se usi il codice per mescolare una vernice, trattalo come un valore orientativo.

Il contagocce funziona da cellulare?

Sì. Sul display touch tocchi un punto dell'immagine e il codice si copia come sul computer. La lente vicino al cursore non compare sui dispositivi touch, quindi per i dettagli piccoli ingrandisci prima l'immagine con lo zoom.

Qual è la differenza tra HEX e RGB?

Entrambe le notazioni descrivono lo stesso colore. RGB lo esprime con tre numeri da 0 a 255, HEX scrive gli stessi numeri in base esadecimale dopo il simbolo #. Per esempio rgb(255, 87, 51) equivale a #ff5733.

Come ottengo l'intera palette di colori di un'immagine?

Apri la scheda Colori dominanti. Trovi fino a otto colori principali dell'immagine e cliccando su uno qualsiasi ne copi il codice.