Convertitore HEX in HSL

HEX
Input
HSL
Risultato
H
S%
L%
RGB
R
G
B

Cos'è Convertitore HEX in HSL

Questo strumento converte i codici colore HEX (come #3B82F6) in valori HSL (come hsl(217, 91%, 60%)). HSL sta per Tonalità, Saturazione e Luminosità — un modello di colore più intuitivo per i designer. Regolare la luminosità in HSL è molto più semplice che in HEX o RGB, ideale per creare palette di colori e proprietà CSS personalizzate.

Come usare

  1. Digita o incolla un codice HEX nel campo HEX (con o senza #).
  2. I valori HSL e RGB appaiono istantaneamente.
  3. Clicca sul pulsante copia accanto a HSL per copiare nel formato hsl(h, s%, l%).
  4. Passa tra i 6 convertitori usando i link in alto.

Quando usarlo

Stai costruendo un sistema di colori a partire da un colore del brand? Incolla l'HEX del brand (#E63946) e ottieni hsl(356, 75%, 56%). Da lì crei tinte più chiare aumentando la luminosità e più scure abbassandola, mantenendo sempre la stessa tonalità.

Domande frequenti

Cos'è HSL e perché usarlo invece di HEX?

HSL (Tonalità, Saturazione, Luminosità) descrive i colori in termini intuitivi. La Tonalità è la posizione sulla ruota dei colori (0–360°), la Saturazione è l'intensità (0–100%) e la Luminosità è la luminosità (0–100%). È molto più facile creare variazioni di colore in HSL che in HEX.

Cos'è #FF0000 in HSL?

Rosso puro #FF0000 è hsl(0, 100%, 50%). Tonalità 0° è il rosso sulla ruota dei colori, 100% di saturazione significa completamente saturo e 50% di luminosità è il colore puro.

CSS supporta i colori HSL?

Sì. Il CSS moderno supporta completamente la notazione `hsl()` e `hsla()`. Ad esempio: `color: hsl(217, 91%, 60%);` e `background: hsla(217, 91%, 60%, 0.5);`

Cos'è #000000 in HSL?

Nero (#000000) è hsl(0, 0%, 0%). Luminosità allo 0% significa nero puro indipendentemente dalla tonalità o dalla saturazione.

Posso condividere questo strumento con i miei dati precompilati?

Sì. L'URL si aggiorna automaticamente mentre digiti. Copia il link dalla barra degli indirizzi o usa il pulsante Condividi — chiunque lo apra vedrà i tuoi dati già inseriti.

Strumenti correlati