Convertitore di codici colore

Incolla un colore in formato hex (#ff6600 o #f60), rgb(255, 102, 0), separato da virgole 255, 102, 0 o hsl(24, 100%, 50%), e il convertitore lo restituisce subito negli altri due formati, con anteprima del campione dal vivo e copia con un clic per formato.

Come funziona la conversione dei codici colore

  1. 1

    Inserisci un colore in un formato supportato

    Hex (#abc, #abcdef), rgb(r, g, b), separato da virgole r, g, b o hsl(h, s%, l%).

  2. 2

    Analizzato in una rappresentazione interna

    Lo strumento converte il valore in RGB internamente, poi deriva da esso gli equivalenti hex e HSL.

  3. 3

    Tutti i formati visualizzati

    Le stringhe hex, RGB e HSL corrispondenti vengono mostrate affiancate.

  4. 4

    Anteprima del campione dal vivo

    Mostra il colore risultante a colpo d'occhio, così puoi confermare la conversione prima di copiarla.

Formati supportati

Formato Esempio Utilizzo
Hex 3 #F66 Abbreviazione; solo per colori con cifre ripetute
Hex 6 #FF6B6B Predefinito per CSS e design grafico
RGB rgb(255, 107, 107) CSS, JS, software di design
Separato da virgole 255, 107, 107 Come RGB senza la sintassi di funzione
HSL hsl(0, 100%, 71%) Più facile da comprendere riguardo a tonalità/saturazione/luminosità

Quando usare quale

  • Hex per CSS statico e passaggio di design.
  • RGB quando passi i canali a JavaScript o al software di design.
  • HSL quando regoli luminosità o saturazione, il modello mentale è più chiaro rispetto a RGB.

Esistono altri formati come HSV, CMYK, LAB, LCH e OKLCH negli strumenti di design. Descrivono lo stesso colore in modi diversi, ma questo convertitore si concentra sui tre formati web principali qui sopra.

Precisione

  • Le conversioni tra hex, RGB e HSL sono esatte: hex e RGB sono lo stesso modello di colore e HSL deriva da RGB con una formula standard.
  • I valori HSL sono arrotondati a numeri interi, quindi un viaggio di andata e ritorno può spostare l’ultima cifra. Il colore visibile è identico; usa hex quando ti serve una copia esatta bit per bit.

Domande frequenti

Hex o rgb() per ampia compatibilità. hsl() quando desideri leggibilità. I browser moderni supportano anche oklch() e altri formati, ma hex resta il default più sicuro.

No, il convertitore accetta solo colori opachi: hex a 3 o 6 cifre, rgb() e hsl() senza canale alpha. Tieni rgba() o l’hex a 8 cifre direttamente nel tuo CSS.

No, il convertitore accetta solo i tre formati numerici. Usa un selettore di colore o una ricerca online per convertire prima il colore nominato in hex.

HSL viene mostrato con tonalità, saturazione e luminosità in numeri interi, quindi un viaggio di andata e ritorno può spostare il valore di un punto. Il colore visibile è identico; usa hex quando ti serve una copia esatta.

Strumenti correlati