ItalianoIT

Selettore di colori e convertitore – HEX, RGB, HSL

Scegli un colore o incolla un qualsiasi codice colore: tutti i formati si aggiornano subito.

Testi e file restano nel tuo browser: non viene inviato nulla a un server.

#0F766E
Codici colore

Tinte chiare (mescolate con il bianco)
Tinte scure (mescolate con il nero)

Clicca su un campione per prendere quel colore. Il numero indica la quota della miscela in percentuale.

Variabili CSS

Come si usa

  1. Clicca sul campione per scegliere un colore, oppure incolla un codice in uno qualsiasi dei campi, per esempio HEX o RGB.
  2. Modifica un campo e tutti gli altri si adeguano. Puoi anche scrivere solo tre numeri senza “rgb(”.
  3. Le file di tinte chiare e scure propongono colori vicini: con un clic diventano il nuovo colore di base.
  4. Dai un nome alla variabile in “Variabili CSS” e copia il blocco nel tuo foglio di stile. Il colore è nell’indirizzo della pagina: puoi condividere il link così com’è.

Domande frequenti

Che differenza c’è tra HEX e RGB?

Entrambi descrivono lo stesso colore con una scrittura diversa. L’HEX scrive i valori di rosso, verde e blu (0–255) con due cifre esadecimali ciascuno, l’RGB scrive gli stessi valori con numeri decimali.

Una stampa con questi valori CMYK sarà uguale allo schermo?

I valori CMYK mostrati qui sono una semplice conversione matematica, da prendere come punto di partenza. I colori reali di stampa dipendono da carta, inchiostro e profilo colore della macchina: verifica i valori con la tua tipografia.

Che cos’è l’OKLCH?

L’OKLCH descrive un colore con la luminosità percepita (L), la saturazione (C, chroma) e la tonalità (H). Il CSS moderno supporta direttamente oklch() e, se cambi solo la luminosità, la tonalità resta visivamente la stessa.

Perché non vedo il pulsante “Preleva dallo schermo”?

Compare solo nei browser desktop che supportano l’API EyeDropper, come Chrome ed Edge. Negli altri browser puoi prelevare i colori da una foto con lo strumento contagocce per immagini.

Strumenti simili

Colore da immagineColori e palette di un’immagineVerifica contrastoRapporto di contrasto, livelli AA e AAAPalette per Tailwind CSSUn colore, una scala 50–950Gradiente CSSGradienti lineari, radiali, conici

Tutti gli strumenti