Selettore di colore da immagine - Ottieni il codice HEX di qualsiasi pixel

Cosa fa questo selettore di colore

Questo è un contagocce, non un generatore di tavolozze: sei tu a decidere quale pixel campionare, e lo strumento riferisce esattamente ciò che vi è memorizzato. La parte che vale la pena spiegare è come viene presa una lettura, perché l'approccio più ovvio è sottilmente sbagliato. Disegnare l'intera immagine su un unico canvas e rileggerne i pixel non funziona sulle foto grandi: i browser limitano l'area totale del canvas a circa 16,7 milioni di pixel, all'incirca 4096 per 4096, e un file da 24 megapixel supera quel tetto senza sforzo. Ridurre l'immagine per farla rientrare renderebbe ogni campione la media di più pixel originali, e così l'unica cosa che un contagocce deve azzeccare sarebbe la prima a perdersi. Il campionamento ridisegna invece soltanto una piccola finestra attorno al puntatore, direttamente dal file decodificato, esattamente in scala 1 a 1. Rettangolo di origine e rettangolo di destinazione hanno la stessa dimensione, quindi il browser copia i pixel anziché ricampionarli, e i valori che ottieni sono i byte stessi del file, per quanto grande sia l'immagine. L'anteprima che vedi può essere ridotta per rientrare nel limite del canvas o nel tuo schermo, ma da lì non viene mai campionato nulla. La stessa finestra alimenta la lente, che dipinge ogni pixel dell'originale come un quadrato di 13 pixel con linee di griglia tra l'uno e l'altro e contorna la cella centrale in bianco e nero, così resta visibile su qualsiasi colore. Ti serve davvero: una foto larga 4000 pixel disposta in una colonna da 720 pixel mette circa 5,6 pixel dell'immagine sotto ogni pixel dello schermo. I tasti freccia spostano il campione esattamente di un pixel dell'originale e Maiusc più freccia di dieci, che è l'unico modo affidabile per centrare un bordo da un pixel o un contorno sottile con antialiasing. Ogni prelievo riporta HEX, RGB e HSL a partire dalla stessa terna a 8 bit, più le forme HEXA a 8 cifre e RGBA quando il pixel non è completamente opaco. Il limite vero da conoscere è la gestione del colore: nella maggior parte dei browser il canvas scarta il profilo ICC incorporato, quindi i valori corrispondono a ciò che il browser dipinge e non a ciò che mostra un editor con gestione del colore.