Convertitore colori (Hex, RGB, HSL)
Anteprima colore
#6366f1
Guida all'uso
Color Converter è uno strumento online per convertire i valori dei colori tra i formati HEX, RGB, HSL, HSV e CMYK — con tutto il processing eseguito localmente nel browser. La conversione di formati colore è un'attività quotidiana per designer e sviluppatori front-end: strumenti di design come Figma esportano codici HEX; CSS usa HEX e RGB/HSL; i flussi di lavoro di stampa richiedono valori CMYK; le librerie di elaborazione immagini possono usare HSV o float RGB normalizzati; gli strumenti di verifica dell'accessibilità usano valori sRGB per il calcolo del contrasto. Convertire manualmente tra questi formati con le formule è tedioso e soggetto a errori. Questo strumento accetta qualsiasi valore colore valido e mostra istantaneamente gli equivalenti in tutti i formati supportati. Inserisci un codice HEX, incolla una tripla RGB, inserisci valori HSL o scegli un colore dal selettore nativo — tutte le rappresentazioni si aggiornano in tempo reale. Il grande swatch di colore fornisce una conferma visiva immediata. Il convertitore gestisce correttamente l'intero gamut sRGB e gestisce i valori fuori range in modo elegante. Puoi anche inserire nomi di colori CSS (come "rebeccapurple", "tomato") per vedere tutti i loro equivalenti numerici. Per i team che devono mantenere design token o palette di colori su più piattaforme (iOS, Android, Web, stampa), questo strumento è un riferimento rapido per garantire la coerenza dei colori tra formati con requisiti diversi.
- Inserisci il valore del colore — Digita o incolla qualsiasi valore colore nel campo di input: un codice HEX (#6366f1 o #fff), un valore RGB (rgb(99, 102, 241)), un valore HSL (hsl(239, 84%, 67%)) o il nome di un colore CSS. Il convertitore rileva automaticamente il formato.
- Usa il selettore colore — Fai clic sullo swatch di colore o sul pulsante del selettore per aprire il selettore colore nativo del browser. Scegli visivamente qualsiasi colore e tutti i valori dei formati vengono aggiornati immediatamente.
- Visualizza tutti gli equivalenti dei formati — Lo strumento mostra il colore selezionato in HEX, RGB (0–255), RGB (0–1 normalizzato), HSL (gradi, percentuale), HSV e CMYK simultaneamente. Tutti i valori si aggiornano insieme ogni volta che cambi qualsiasi input.
- Regola i canali singoli — Affina il colore modificando i valori dei singoli canali — ad esempio, cambia solo il canale alpha in RGBA, o regola il tono in HSL per ottenere una variante leggermente più calda o più fredda dello stesso colore.
- Copia qualsiasi formato — Fai clic sul pulsante "Copia" accanto a qualsiasi riga di formato per copiare quel valore specifico negli appunti. Per esempio, copia il codice HEX per CSS, il valore RGB per strumenti di design, o il valore CMYK per le specifiche di stampa.
- Verifica tramite lo swatch — Il grande swatch di anteprima del colore mostra sempre il colore effettivamente renderizzato. Usalo per confermare visivamente che i valori convertiti corrispondano al colore previsto prima di copiarli.
Domande frequenti
Quali formati di colore supporta questo strumento?
Lo strumento converte tra i tre formati CSS più comuni: HEX (#RRGGBB), RGB (rgb(r, g, b) con valori 0–255) e HSL (hsl(h, s%, l%) con angolo 0–360° e saturazione/luminosità 0–100%). Accetta anche i nomi CSS dei colori (come "tomato" o "deepskyblue") come input.
Qual è la differenza tra RGB e HSL?
RGB descrive i colori tramite l'intensità di luce rossa, verde e blu (ciascuna 0–255). HSL descrive i colori tramite tonalità (posizione sulla ruota cromatica, 0–360°), saturazione (vivacità, 0–100%) e luminosità (chiarezza, 0–100%). HSL è spesso più intuitivo per i designer poiché regolare la luminosità o la saturazione è semplice.
La conversione del colore avviene su un server?
No. Tutta la logica di conversione avviene nel browser tramite calcoli colore JavaScript nativi — nessun dato viene inviato a nessun server.
Posso usare questo strumento offline?
2Kit è una PWA. Dopo la prima visita, lo strumento viene memorizzato nella cache e funziona completamente offline.
Perché ho bisogno di convertire tra formati di colore?
Strumenti e flussi di lavoro diversi usano formati di colore diversi. Gli strumenti di design spesso producono HEX, mentre le animazioni CSS e i sistemi di temi potrebbero usare HSL per una manipolazione programmatica più semplice. Questo strumento ti permette di tradurre rapidamente tra formati senza calcoli mentali.
Implementazione tecnica
Tutta l'elaborazione viene eseguita interamente nel browser — nessun dato viene mai inviato a server. Questo strumento funziona completamente offline come Progressive Web App (PWA): dopo la prima visita, tutte le pagine e le risorse vengono memorizzate nella cache dal Service Worker e rimangono disponibili senza connessione internet. I dati inseriti non lasciano mai il dispositivo, rendendolo sicuro per contenuti sensibili come chiavi API, password, configurazioni private e documenti riservati.