Contagocce colore da immagine: codici HEX e RGB
Hai una foto o uno screenshot e ti serve il codice di un colore, ma nessuno ha il file del marchio. Il contagocce colore da immagine risolve il problema: clicchi sul punto e leggi il valore HEX e RGB. In più lo strumento scansiona la figura e propone fino a otto colori frequenti, utili per far combaciare un pulsante con il logo di una schermata o per trovare il tono del cielo in una foto.
Dal file agli appunti
- Clicca sull'area di caricamento o trascina un'immagine. Il selettore accetta ogni tipo di immagine che il browser sa aprire; PNG, JPG e WebP sono la scelta sicura.
- Clicca un punto dell'immagine. Il riquadro grande mostra il colore e i campi HEX e RGB si riempiono.
- Premi il pulsante di copia accanto a Codice HEX o Codice RGB per mettere il valore negli appunti.
- Guarda la palette sotto l'immagine. Un clic su un campione lo rende il colore corrente e ne copia anche il codice HEX.
- Premi Altra immagine per ripartire con un nuovo file.
Perché un campione non coincide con il pixel
La palette è una stima. Lo strumento campiona circa 10.000 pixel, salta quelli per lo più trasparenti e arrotonda ogni canale a passi di 16. Poi conta i gruppi e mostra gli otto più frequenti. Un campione può quindi differire fino a 8 per canale da un pixel reale. Per il valore esatto clicca sull'immagine. Ogni clic legge un solo pixel nella dimensione originale del file, anche se l'anteprima è limitata a 400 pixel di altezza. In una foto con rumore due pixel vicini possono differire di qualche passo, quindi clicca due volte se il valore sembra strano. Un'immagine molto grande richiede un attimo, perché per la palette viene letta tutta una volta.
Limiti e riservatezza del file
La selezione avviene solo con il clic, senza anteprima al passaggio del mouse. Si vedono solo HEX e RGB, senza HSL e senza valore alfa. Il file è letto con un FileReader e disegnato su una canvas nel browser, e i pixel si leggono da lì con getImageData. Aprire un'immagine o cliccare un colore non invia nessuna richiesta, come mostra il pannello di rete degli strumenti per sviluppatori. Gli appunti vengono usati solo quando premi un pulsante di copia o clicchi un campione.