Utilore

Selettore di colore

Muoviti sul quadrato per scegliere un colore, oppure prendine uno che esiste già: da un’immagine con il contagocce, o da qualunque punto dello schermo dove il browser lo consente. Il codice compare subito in tutte e tre le notazioni.

Scegli un colore

Recenti

Prelevare il colore da qualunque punto dello schermo è una funzione del browser che hanno solo Chrome ed Edge. In Safari e Firefox il pulsante non compare affatto: prometterlo e poi rifiutare sarebbe peggio che non offrirlo. Lì usa un’immagine: una schermata funziona altrettanto bene.

L’immagine resta in questa scheda: il colore viene letto da un canvas qui stesso, non viene caricato nulla. I colori recenti restano in memoria solo su questo dispositivo.

Nelle vicinanze: Convertitore di colori · Generatore di palette di colori · Generatore di gradienti CSS · Da HEX a RGB

Come si usa

  1. Trascina sul quadrato per scegliere la sfumatura, e muovi il cursore della tonalità sotto per cambiare famiglia di colore.
  2. Imposta l’opacità se ti serve un colore semitrasparente: compare nel codice come rgba o come due caratteri in più nell’HEX.
  3. Per prendere un colore che esiste già, premi «Preleva da un’immagine» e clicca sulla figura. In Chrome ed Edge puoi anche prelevare direttamente dallo schermo.
  4. Premi «Copia» accanto alla notazione che ti serve. Il colore finisce nella striscia dei recenti, così puoi tornarci.

Da sapere

Perché il quadrato è costruito su HSV

In HSV il quadrato di saturazione contro luminosità è pieno da bordo a bordo: ogni punto è un colore a sé. Costruisci lo stesso quadrato su HSL e degenera: la riga in alto è tutta bianca e quella in basso tutta nera, e metà dell’area non seleziona nulla. È tutta qui la ragione della scelta, ed è ciò che il test protegge.

Tre vie d’ingresso, perché le persone arrivano con domande diverse

Scegliere un colore e trovarne uno sono lavori diversi. Il quadrato serve a scegliere. Il contagocce su un’immagine serve per un colore che esiste già da qualche parte: in uno screenshot, in un logo, in una fotografia. Prelevare dallo schermo è la stessa cosa senza uscire dalla finestra, e sanno farlo solo Chrome ed Edge.

Dove compare la trasparenza

L’opacità viene scritta solo quando non è piena: «rgb(31, 95, 214)» invece di «rgba(31, 95, 214, 1)», perché tanto la seconda forma la si ripulisce a mano. Nell’HEX la trasparenza diventa due caratteri in più alla fine: ogni browser attuale li capisce, gli strumenti più vecchi no, quindi a piena opacità la coda viene omessa.

Domande frequenti

Perché nel mio browser non c’è il pulsante «preleva dallo schermo»?

Perché Safari e Firefox non sanno farlo. La funzione è del browser, non nostra, e ce l’hanno solo Chrome ed Edge. Mostrare il pulsante per poi rifiutare sarebbe peggio che non offrirlo, quindi semplicemente non c’è. Fai uno screenshot e usa l’immagine: il risultato è identico.

Come ottengo il colore di un pixel in una foto?

Premi «Preleva da un’immagine», scegli il file e muovi il puntatore sulla figura: il colore segue il puntatore. Clicca per fissarlo. L’immagine non viene caricata da nessuna parte: è disegnata su un canvas in questa scheda e letta da lì.

Posso scrivere un colore invece di sceglierlo?

Sì. Scrivilo in uno qualsiasi dei tre campi in una forma consueta — #1f5fd6, 1f5fd6, rgb(31, 95, 214) — e gli altri due si riempiono da soli insieme al quadrato. Se ti serve solo convertire fra notazioni, il convertitore di colori qui accanto è la strada più breve.

Il cursore della tonalità salta quando porto la luminosità a zero.

Non dovrebbe, e infatti non lo fa: il nero e il bianco non hanno tonalità, quindi il cursore mantiene la precedente invece di scattare sul rosso. È voluto: altrimenti ogni discesa in fondo al quadrato ti farebbe perdere la famiglia di colore in cui stavi lavorando.

Dove sono conservati i colori recenti?

Su questo dispositivo, nel browser. Non vengono inviati da nessuna parte e non sono legati a te: cancella i dati del sito e la striscia torna vuota.

Strumenti correlati