Softonic

Selettore colore HEX

Passaggio 1 / 4 HEX colour picker

Preimpostazioni comuni

Scegli un colore con il controllo visivo del browser oppure inserisci un valore HEX di tre o sei cifre. Il selettore lo converte in RGB, HSL e CMYK approssimativo, poi calcola luminanza relativa e rapporti di contrasto esatti su bianco e nero. Il colore viene elaborato in questo browser e non compare nell’URL dei passaggi.

Come scegliere un colore

  1. 1

    Parti da un esempio o dal controllo colore

    Scegli un colore di esempio oppure apri il selettore nativo del browser.

  2. 2

    Inserisci un HEX esatto

    Digita tre cifre come #F60 oppure sei come #FF6600. Il formato breve viene espanso correttamente.

  3. 3

    Controlla i formati calcolati

    Visualizza insieme HEX, RGB, HSL, CMYK stimato e luminanza relativa sRGB.

  4. 4

    Controlla il contrasto e copia

    Confronta il colore con bianco e nero, poi copia il valore HEX, RGB o HSL necessario.

Notazioni colore nella pratica

Ogni modello colore risponde a una domanda leggermente diversa.

Riferimento delle notazioni

Notazione Componenti Dove si usa
HEX #RRGGBB CSS, strumenti di design, linee guida di marca
RGB rosso 0–255, verde 0–255, blu 0–255 CSS rgb(), editor di immagini
HSL tonalità 0–360°, saturazione %, luminosità % CSS hsl(), sistemi di design
CMYK ciano %, magenta %, giallo %, key/nero % Stampa, prestampa

Contrasto di accessibilità

WCAG 2.2 definisce i rapporti minimi di contrasto tra testo e sfondo:

  • AA per testo normale: ≥ 4,5:1
  • AA per testo grande (18 pt o 14 pt in grassetto): ≥ 3:1
  • AAA per testo normale: ≥ 7:1

Il selettore calcola in tempo reale il rapporto su bianco e su nero. Se un colore di primo piano personalizzato è fondamentale, usa un verificatore di contrasto dedicato per ogni coppia di colori.

Suggerimenti

  • HEX è il formato predefinito nella maggior parte degli strumenti di design, ma il formato breve a tre cifre (#F60) equivale a #FF6600, non a #F06060.
  • HSL è più comodo per costruire palette: blocca la tonalità e varia la luminosità per creare tinte e ombre.
  • CMYK e RGB non si convertono mai in modo perfetto, la stampa CMYK dipende dal profilo della macchina da stampa. Verifica sempre con una prova su carta reale.
  • Se progetti per CSS moderno, valuta OKLCH per ottenere passaggi di luminosità percettivamente uniformi.

Domande frequenti

Photoshop applica un profilo colore, di solito sRGB per lo schermo e spesso un profilo diverso per la stampa. I browser interpretano i valori HEX non profilati come sRGB. Se il documento è impostato su Adobe RGB o ProPhoto, i valori dei pixel restano uguali, ma il colore percepito cambia.

Sì, entrambi indicano rosso pieno: rosso a 255, verde e blu a 0. HEX è semplicemente una notazione esadecimale a due cifre per ogni valore di canale da 0 a 255.

Scegli il colore principale e copia il valore HSL. In CSS o nel programma di grafica, mantieni fisse tonalità e saturazione e modifica la luminosità. Verifica ogni coppia di primo piano e sfondo.

Il colore corrente resta fino a 30 minuti in questa scheda per accompagnare il percorso guidato. Non viene aggiunto all’URL né trasmesso tramite i nostri server. Ricominciare, chiudere la scheda, cancellare i dati del browser o attendere la scadenza lo elimina.

Strumenti correlati

Generatore di lettere casuali

Genera lettere A-Z casuali. Scegli la quantità, usa maiuscole, minuscole o un mix, e applica il risultato a giochi, spunti o attività in classe.

Semplificatore di Algebra Booleana

Semplifica le espressioni booleane utilizzando le mappe di Karnaugh e l'algoritmo di Quine-McCluskey. Mostra ogni passo di minimizzazione e una forma finale SOP/POS.

Generatore di Palette di Colori

Genera palette monocromatiche, analoghe, complementari, triadiche o tetradiche da un colore base HEX ed esporta variabili CSS pronte da copiare.

Generatore di palette colori casuali

Genera palette casuali da 2 a 15 campioni, scegli uno stile vivace, pastello, tenue o scuro e copia codici HEX o variabili CSS.

Convertitore BBCode in HTML

Converti BBCode (markup per forum) in HTML pulito. Gestisce tag di formattazione, elenchi, citazioni, codice, immagini, link e tabelle.

Binario a Decimale

Converti numeri binari in decimali istantaneamente. Mostra l'espansione posizionale così puoi vedere come ogni bit contribuisce.