Converte qualsiasi codice colore hex in RGB direttamente nel browser — supporta hex a 3, 6 e 8 cifre con alpha. Gratuito, istantaneo, online, senza registrazione, i colori non lasciano mai la pagina.
Tints
Shades
Tones
Harmonies
— — — — — Un convertitore HEX in RGB è una piccola utility che trasforma un codice colore hex (`#FF5733`) nei tre valori interi di canale che rappresenta (`rgb(255 87 51)`). hex e RGB sono i due formati attorno a cui ogni foglio di stile web, strumento di design e pipeline di pixel di immagine è stato costruito fin dalla fine degli anni '90, e la conversione tra di loro è la singola operazione più comune nel tooling di colore. hex è il formato terso da copia-incolla che Figma, Sketch, Photoshop e ogni PDF di brand guidelines esportano di default — una stringa base-16 di 6 caratteri che entra comodamente in una custom property CSS e si legge a colpo d'occhio una volta che l'occhio impara i pattern. RGB è il formato indirizzato per canale che le API hardware, le chiamate di disegno canvas, la manipolazione di buffer immagine, gli attributi colore OpenGL e la maggior parte degli SDK grafici si aspettano — tre interi 0-255 separati (o float normalizzati 0-1) che mappano direttamente sui subpixel rosso, verde e blu di un LCD o sui fosfori di un CRT. La conversione tra di loro è meccanica: si divide l'hex in tre coppie da 2 cifre e si legge ogni coppia come un numero in base 16. Questo strumento esegue quella conversione in tempo reale mentre digita, senza alcun pulsante "Converti" da premere, e affianca all'output RGB ogni altro formato colore comune (HSL, OKLCH, OKLAB, HSV, HWB, CMYK, oltre ai 148 colori CSS named) gratis.
**Il formato RGB stesso merita uno sguardo più ravvicinato.** Il sRGB standard a 24 bit codifica ogni canale come intero unsigned a 8 bit da 0 a 255 — 256 valori per canale, 16.777.216 colori in totale (256³). Lo standard di riferimento è IEC 61966-2-1, la specifica sRGB del 1996 ancorata ai primari fosforici dei monitor CRT che dominavano i display dell'epoca. CSS espone RGB attraverso la funzione `rgb()` in tre varianti sintattiche. La forma originale CSS 1 usa separatori a virgola: `rgb(255, 87, 51)`. CSS Color 4 (W3C Candidate Recommendation dal 2022) ha aggiunto una moderna forma con spazi: `rgb(255 87 51)`, con un canale alpha opzionale dopo una slash: `rgb(255 87 51 / 0.5)`. Entrambe le forme sono interscambiabili e arrivano in ogni evergreen browser. RGB accetta anche canali in percentuale: `rgb(100% 33% 20%)` è equivalente a `rgb(255 87 51)`, talvolta preferito nei fogli di stile scritti a mano per leggibilità. Specificamente l'alpha ha una funzione `rgba()` separata per il supporto legacy — `rgba(255, 87, 51, 0.5)` è la forma canonica che funziona ovunque fino a IE 9. CSS Color 4 ha aggiunto anche una sintassi `color(srgb 1 0.341 0.2)` per l'indirizzamento sRGB esplicito, e funzioni parallele `color(display-p3 ...)` e `color(rec2020 ...)` per valori wide-gamut che hex non può codificare.
La matematica della conversione va in entrambe le direzioni in modo pulito. **HEX a RGB**: si analizza l'hex a 6 cifre `#RRGGBB` come tre numeri base-16 a 2 cifre tramite `parseInt(hex.slice(1, 3), 16)`, `parseInt(hex.slice(3, 5), 16)`, `parseInt(hex.slice(5, 7), 16)`. Per l'abbreviazione a 3 cifre `#RGB`, si espande ogni cifra duplicandola (`#F73` → `#FF7733`) prima del parsing — questo *non* è un left-pad. Per l'alpha a 8 cifre `#RRGGBBAA`, si analizza la coppia finale allo stesso modo e si divide per 255 per ottenere il float alpha 0-1. Per l'abbreviazione alpha a 4 cifre `#RGBA`, si espande prima ogni cifra (`#F738` → `#FF773388`). **RGB a HEX** è l'inverso: per ogni canale si chiama `value.toString(16).padStart(2, '0')` per ottenere la coppia hex a 2 cifre (il `padStart` conta — senza, il valore di canale 5 verrebbe serializzato come `'5'` invece di `'05'`, producendo un hex non valido), poi si concatena. Entrambe le direzioni sono bit-exact in qualunque direzione: 16² = 256, che corrisponde esattamente all'intervallo di byte 0-255 occupato da ogni canale, quindi un round-trip HEX → RGB → HEX produce verbatim l'input originale senza drift float.
**Perché hex rispetto a RGB?** hex è più breve, design-tool-native ed è il formato che l'occhio impara nel tempo — la maggior parte degli sviluppatori front-end riconosce `#3b82f6` come blue-500 di Tailwind a colpo d'occhio. RGB è l'indirizzamento esplicito per canale, più facile da elaborare in JavaScript, ed è l'unico dei due ad accettare alpha e percentuali in modo pulito. I due formati coesistono perché risolvono problemi diversi. I fogli di stile web e le brand guidelines tendono a hex perché il costo del copia-incolla domina. Le chiamate di disegno canvas, l'elaborazione delle immagini, le API LED hardware e qualunque codice che fa aritmetica per canale tendono a RGB perché indicizzare in una tupla batte fare slicing di una stringa. Lo switch tra di loro avviene decine di volte in un tipico progetto web — si incolla un hex da Figma, si converte in interi RGB per una chiamata `ctx.fillStyle = ...`, si riconverte in hex per la definizione di una variabile CSS.
Il flusso di lavoro HEX → RGB di questo strumento è una direzione di una famiglia a 5 spoke che condividono tutti lo stesso convertitore di colori unificato sottostante. Il dedicato convertitore di colori unificato è l'hub — mostra tutti i 9 formati simultaneamente modificabili ed è lo strumento giusto quando il flusso di lavoro necessita di più che solo hex e RGB. Gli spoke monodirezionali mirano a specifiche intenzioni di ricerca Google: il convertitore RGB-hex inverso per la direzione opposta, il convertitore HEX-HSL per lo spazio legacy designer-cognitive, il convertitore HEX-OKLCH per i design system percettivamente uniformi moderni (Tailwind v4 e shadcn ora usano entrambi OKLCH di default), e il convertitore HEX-CMYK per le approssimazioni di preparazione alla stampa. Tutti e cinque gli spoke e l'hub condividono lo stesso motore di parsing e la stessa matematica di conversione, quindi i risultati sono garantiti identici lungo la famiglia. Ogni conversione gira localmente nel browser — i suoi codici hex non vengono mai caricati online, mai loggati, e zero richieste di rete partono mentre digita. Lo verifichi in DevTools.
// Parse any hex shape (3/4/6/8-digit) into an RGB tuple [r, g, b, a]
// All channels in 0-255 range; alpha in 0-1.
function parseHex(input) {
let h = input.trim().replace(/^#/, '');
// Expand 3-digit and 4-digit shorthand by duplicating each digit
if (h.length === 3 || h.length === 4) {
h = h.split('').map(c => c + c).join('');
}
if (!/^[0-9a-fA-F]+$/.test(h) || (h.length !== 6 && h.length !== 8)) {
throw new Error(`Invalid hex: ${input}`);
}
const r = parseInt(h.slice(0, 2), 16);
const g = parseInt(h.slice(2, 4), 16);
const b = parseInt(h.slice(4, 6), 16);
const a = h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1;
return [r, g, b, a];
}
console.log(parseHex('#FF5733')); // [255, 87, 51, 1]
console.log(parseHex('#F73')); // [255, 119, 51, 1]
console.log(parseHex('#FF573380')); // [255, 87, 51, 0.5019607843137255] 3 cifre `#F73`, alpha a 4 cifre `#F738`, 6 cifre `#FF5733`, alpha a 8 cifre `#FF5733CC`, oltre alla variante senza `#` per ognuna (`F73`, `FF5733`, ecc.). Il parser le normalizza tutte nella stessa tupla RGB interna prima della visualizzazione, quindi può incollare qualsiasi forma usi la sua sorgente senza espandere manualmente l'abbreviazione prima. Anche le maiuscole/minuscole vengono normalizzate — `#ff5733` e `#FF5733` producono output identico.
Il campo RGB espone il valore nella forma moderna di CSS Color 4: `rgb(255 87 51)` per colori opachi, `rgb(255 87 51 / 0.5)` per quelli con alpha. Entrambe le forme funzionano in ogni evergreen browser (Chrome 65+, Safari 13+, Firefox 52+). La forma legacy con virgole `rgb(255, 87, 51)` dista solo una sostituzione meccanica se il target la richiede; la sintassi moderna è preferita nel nuovo codice perché si allinea con le altre sintassi funzionali di CSS Color 4.
HEX → RGB è matematica intero-su-intero: `parseInt(hex, 16)` restituisce un valore esatto 0-255 con zero coinvolgimento di float. La direzione inversa (`.toString(16).padStart(2, '0')`) è altrettanto esatta. Un round-trip HEX → RGB → HEX → RGB → HEX produce verbatim l'input originale, indefinitamente. La fonte di verità interna OKLCH fa sì che anche la catena più lunga HEX → RGB → HSL → OKLAB → HEX resti bit-stable, cosa che i convertitori legacy che instradano attraverso HSL non garantiscono.
L'hex a 8 e 4 cifre con alpha (`#RRGGBBAA` e `#RGBA`) viene analizzato correttamente. La coppia finale mappa su un float alpha 0-1: `00` → 0, `80` → 0,502, `FF` → 1. L'output usa di default la sintassi con slash di CSS Color 4 (`rgb(255 87 51 / 0.5)`); la forma legacy `rgba(255, 87, 51, 0.5)` dista una sostituzione. Utile per la migrazione di design token in cui i valori alpha potrebbero essere sepolti in codici hex a 8 cifre.
Lo stesso hex che incolla guida anche HSL, HSV, HWB, OKLCH, OKLAB, CMYK e il colore CSS named più vicino — tutti visibili a colpo d'occhio sulla stessa pagina. Non resta mai vincolato a hex → RGB soltanto. Se un collega ha bisogno della tripletta OKLCH per un token Tailwind v4, del colore named più vicino per la prosa di documentazione o dell'approssimazione CMYK per un preventivo di stampa, i valori sono già lì con i loro pulsanti Copia.
Faccia passare un hex e la riga di contrasto lo valuta immediatamente sia contro il bianco sia contro il nero usando WCAG 2.1 (minimo normativo: 4,5:1 per il body text, 7:1 per AAA) e APCA Lc (successore proposto WCAG 3: target `|Lc| ≥ 75` per il body text). Utile quando ha appena convertito un hex brand in RGB e vuole verificare che sia davvero leggibile come colore body text prima di spedirlo.
Sotto il picker, la sezione Copia come codice trasforma il colore corrente in snippet pronti per il copia-incolla per cinque piattaforme: custom property CSS (`--color-brand: rgb(255 87 51)`), token `@theme` di Tailwind v4, literal SwiftUI `Color(red:green:blue:)`, costante Jetpack Compose `Color(0xFFFF5733)`, Flutter `Color(0xFFFF5733)`. La sintassi esatta che ogni piattaforma si aspetta, pronta per essere inserita in un asset catalog iOS, un file di tema Android o un `ThemeData` Flutter.
Tutto il parsing hex, la conversione RGB, il calcolo del contrasto e la generazione di palette girano localmente nel browser. I suoi codici hex non vengono mai trasmessi, mai loggati su alcun server, mai analizzati. Zero richieste di rete mentre digita — lo verifichi in DevTools. Sicuro per palette brand non ancora annunciate, design token interni, mockup in bozza sotto NDA e qualunque altro lavoro di colore riservato.
Il colore corrente viene codificato nell'hash URL come `#hex=ff5733` automaticamente a ogni cambio. Copi l'URL, lo incolli in un thread Slack o in una issue GitHub, e chiunque lo apra atterra sullo stesso hex con lo stesso risultato RGB. L'hash vive solo nella sua barra degli indirizzi e non viene mai trasmesso al server (i browser non includono i frammenti URL nelle richieste HTTP), quindi anche condividere il link non rivela il colore ad alcuna terza parte.
Il risultato Google di default per "hex to rgb" — un form monodirezionale con hex in ingresso e RGB in uscita, senza altri formati visibili. Utile per lookup occasionali quando si arriva da ricerca. Manca di OKLCH, controllo del contrasto, rilevamento della gamma cromatica, gestione dell'alpha e della vista simultanea multi-formato. Questo strumento vince su ogni asse tranne il caso bare-bones di singola conversione.
Pagine SEO per-colore di lunga data con metadata profondi: conversioni, palette, armonie, gradienti per qualunque hex si interroghi. UI datata (primi anni 2010), nessun supporto OKLCH, nessun contrasto APCA, nessuna gestione wide-gamut. Forte per la discovery SEO di un hex specifico via Google; più debole per flussi di conversione attivi dove digitare in una UX a campi unificati è più veloce.
Toggle HEX/RGB/HSL beginner-friendly su una pagina focalizzata sull'insegnamento, ubiquo nei risultati di ricerca. Nessun OKLCH, nessuna gestione dell'alpha oltre rgba, nessuna feature avanzata. Utile come riferimento accanto al contenuto esplicativo di W3Schools. Questo strumento vince su ogni altro asse: più formati, matematica percettiva, feature di gamma cromatica + contrasto + CVD, export di codice moderno per Tailwind v4 / SwiftUI / Compose / Flutter.
I DevTools di Chrome, Firefox e Safari includono tutti un color picker che converte hex in RGB inline quando si clicca su un campione (di colore) nel pannello CSS. Gratuito, nessuna installazione, sempre disponibile. Manca di OKLCH, di URL condivisibili, di export di codice per piattaforme non-web (SwiftUI, Compose). Apra i DevTools quando sta già debuggando CSS; apra questo strumento quando le serve output cross-piattaforma.
Inclusa in ogni Mac fin da OS X — passa il cursore su qualunque pixel e legga i valori RGB / hex / lineari. Eccellente per campionare colori pixel da qualunque app sullo schermo. Non converte valori hex incollati; è uno screen-sampler, non un convertitore. Usi il pulsante EyeDropper nel picker di questo strumento (solo browser Chromium) per la stessa capacità di screen-sampling dentro il browser.
Pagine SEO per-colore che coprono molti spazi (HEX, RGB, HSL, HSV, CMYK, XYZ, CIELAB). Manca del supporto OKLCH moderno e della UX di modifica a campi unificati. Le pagine di contenuto auto-generato sembrano in stile content farm ma i dati di conversione sono corretti. Buono per esplorare i metadata di singoli colori via Google; questo strumento è più veloce per flussi di lavoro attivi.
#FF5733
Output RGB: `rgb(255 87 51)`. Il caso d'uso classico — un designer ha rilasciato un colore brand in Figma, lei ha fatto uno screenshot, un eyedropper le ha dato l'hex e ora le servono gli interi di canale per una chiamata di disegno canvas, una striscia LED hardware o aritmetica sui pixel contro un buffer immagine. La sintassi con spazi di CSS Color 4 mostrata è la forma moderna; la forma legacy con virgole `rgb(255, 87, 51)` ha significato identico ed è supportata in ogni browser fin da IE 3.
#3b82f6
Output RGB: `rgb(59 130 246)`. Il selettore Color di Adobe (in Photoshop, Illustrator e InDesign) accetta interi RGB nell'intervallo 0-255 come input nativo — incolli 59 / 130 / 246 nelle tre caselle di canale e avrà replicato esattamente il `blue-500` di Tailwind. Utile quando un designer deve mostrare un colore web in un'app di layout pensata per la stampa, oppure quando sta campionando colori brand in una libreria di campioni per modifiche su immagine.
#FF573380
Output RGB: `rgb(255 87 51 / 0.5)`. L'ultima coppia (`80`) si decodifica come `128/255 ≈ 0,502`, esposta come canale alpha tramite la sintassi con slash di CSS Color 4. La forma legacy equivalente è `rgba(255, 87, 51, 0.5)`, ancora supportata ovunque e quella che i vecchi preprocessori si aspettano. L'hex a 8 cifre è arrivato nativamente in tutti gli evergreen browser nel 2018; prima di allora, l'alpha andava espresso tramite la funzione `rgba()`.
#F73
Output RGB: `rgb(255 119 51)`. La specifica CSS definisce l'hex a 3 cifre come abbreviazione in cui ogni cifra viene duplicata per formare l'equivalente a 6 cifre: `#F73` si espande in `#FF7733`, quindi R = `FF` = 255, G = `77` = 119, B = `33` = 51. Questo *non* è un left-pad — `#F73` **non** è `#000F73`. Molti principianti sbagliano; il comportamento di espansione dello strumento rende la regola visibile a colpo d'occhio.
Tabella di riferimento dei 10 codici hex più convertiti e i loro equivalenti RGB — primari puri, secondari puri e due colori brand del mondo reale dalla palette Tailwind.
Nero puro. Tutti e tre i canali a zero — l'assenza di luce emessa. Tripletta RGB (0, 0, 0).
#000000 → rgb(0 0 0) Il nero puro su schermo raramente è la scelta di design giusta — provi `#111` o luminosità percettiva OKLCH 0,1-0,15 per un body text più morbido.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Bianco puro. Tutti e tre i canali al valore massimo (255). Il colore più luminoso in sRGB.
#FFFFFF → rgb(255 255 255) Gli sfondi bianchi puri possono produrre affaticamento visivo in ambienti scuri — consideri `#fafafa` o OKLCH 0,98 per alternative più calde.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Rosso puro. Canale R al massimo, G e B a zero. Il primo dei tre primari sRGB.
#FF0000 → rgb(255 0 0) Il rosso puro è altamente saturo e raramente si adatta a una palette brand — la maggior parte dei colori brand "rossi" è più vicina a #DC2626 o #E53935.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Verde puro. Canale G al massimo, R e B a zero. Colore CSS named `lime` (non `green`, che è #008000).
#00FF00 → rgb(0 255 0) La parola chiave CSS `green` corrisponde a #008000 (mezza luminosità), non a #00FF00 — fonte frequente di confusione. Usi `lime` per il verde RGB puro.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Blu puro. Canale B al massimo, R e G a zero. Il terzo primario sRGB.
#0000FF → rgb(0 0 255) Il blu puro su sfondo bianco non passa il contrasto WCAG AA (3,7:1) — consideri blu brand più scuri come #1D4ED8 (Tailwind blue-700) per il body text.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Ciano — verde e blu al massimo, rosso a zero. Uno dei tre secondari sRGB. Colore CSS named `cyan` (o equivalentemente `aqua`).
#00FFFF → rgb(0 255 255) `cyan` e `aqua` sono sinonimi esatti in CSS — entrambi corrispondono a #00FFFF. Ne scelga uno e resti coerente lungo il foglio di stile.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Magenta — rosso e blu al massimo, verde a zero. Colore CSS named `magenta` (o equivalentemente `fuchsia`).
#FF00FF → rgb(255 0 255) `magenta` e `fuchsia` sono sinonimi esatti in CSS — entrambi corrispondono a #FF00FF. Comune nei test pattern e negli overlay degli strumenti di sviluppo.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Giallo — rosso e verde al massimo, blu a zero. Il più luminoso dei tre secondari sRGB per luminanza percepita.
#FFFF00 → rgb(255 255 0) Il giallo è il colore non-bianco a più alta luminanza su schermo — il testo giallo su sfondi bianchi è quasi invisibile, anche se l'hex sembra a posto sulla carta.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Il colore brand blue-500 di default di Tailwind CSS — il "web blue" canonico della metà anni 2020. Usato in innumerevoli dashboard, siti marketing e strumenti admin.
#3b82f6 → rgb(59 130 246) Tailwind v4 ridefinisce blue-500 in OKLCH (`oklch(0.629 0.193 263.4)`) per scale percettivamente uniformi — l'hex resta lo stesso come fallback.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Il rose-500 di default di Tailwind CSS — un rosa-rosso ad alta saturazione usato comunemente per pulsanti accent, stati di alert e contrasto brand.
#f43f5e → rgb(244 63 94) Rose-500 passa WCAG AA (4,6:1) contro il bianco per il testo grande ma non passa per il body text — abbini con rose-600 (#e11d48) o più scuro per body copy su bianco.
Le serve OKLCH invece? Provi il convertitore HEX-OKLCH dedicato per output percettivamente uniforme.
Rilasci qualsiasi valore hex nell'input HEX — con o senza il `#` iniziale, in abbreviazione a 3 cifre (`#F73`), forma completa a 6 cifre (`#FF5733`), abbreviazione alpha a 4 cifre (`#F738`) o forma completa alpha a 8 cifre (`#FF5733CC`). Lo strumento normalizza internamente tutte e cinque le forme di input nello stesso colore canonico. Le maiuscole/minuscole non contano (`#ff5733` e `#FF5733` vengono analizzati in modo identico). Caratteri non validi o conteggi cifre errati producono un errore inline silenzioso; l'hex valido aggiorna in tempo reale ogni altro campo di formato.
Il campo RGB sotto il campo HEX mostra il valore `rgb()` corrispondente nella moderna sintassi con spazi di CSS Color 4: `rgb(255 87 51)` per un colore opaco, `rgb(255 87 51 / 0.5)` per uno con alpha. Ogni canale è un intero 0-255; l'alpha è normalizzato in 0-1. I valori sono bit-exact — `parseInt('FF', 16)` restituisce 255, senza aritmetica float coinvolta, quindi un round-trip a hex produce verbatim l'input originale.
Ogni scheda di formato ha un pulsante Copia sulla destra. Un clic e il valore finisce negli appunti — l'etichetta del pulsante passa brevemente a "Copiato!" per conferma. La stringa copiata è la sintassi canonica di CSS Color 4 (`rgb(255 87 51)`); se il target richiede la forma legacy con virgole, la conversione è meccanica (si sostituiscono gli spazi con `, `). Per output specifico per piattaforma (SwiftUI, Compose, Flutter, Tailwind v4), usi la sezione Copia come codice sotto il picker.
Lo stesso hex che incolla accende anche gli altri campi di formato — HSL per il CSS legacy, OKLCH e OKLAB per i design system percettivamente uniformi, HSV e HWB per i flussi di lavoro con color picker per designer, CMYK per le stime di stampa, e il colore CSS named più vicino per documentazione e prosa. Non resta mai vincolato a hex → RGB soltanto; se le serve anche la tripletta OKLCH da inserire in un blocco `@theme` di Tailwind v4, è lì nel campo OKLCH con il suo pulsante Copia.
Sotto la griglia dei formati ci sono un quadrato SL + cursore di tonalità + cursore alpha per l'esplorazione visiva. Trascini un controllo qualsiasi e ogni campo di testo si aggiorna in tempo reale, inclusi l'HEX e l'RGB da cui è partito. Sui browser Chromium-based (Chrome, Edge, Brave) il pulsante EyeDropper attiva l'API nativa `EyeDropper` per campionare qualunque pixel sullo schermo, anche fuori dalla finestra del browser — utile quando vuole catturare un hex dall'UI di un'altra app senza fare prima uno screenshot.
L'abbreviazione a 3 cifre `#RGB` si espande *duplicando ogni cifra*, non facendo left-pad con zeri. `#F73` diventa `#FF7733` (arancione brillante), non `#000F73` (blu scuro). Questo è l'angolo più sbagliato della sintassi colore CSS; i principianti spesso assumono che l'abbreviazione sia una sorta di zero-pad e finiscono con colori radicalmente sbagliati. La stessa regola si applica all'abbreviazione alpha a 4 cifre `#RGBA` — ogni cifra si duplica per formare l'equivalente a 8 cifre.
Assumere che #F73 faccia left-pad in #000F73: atteso: blu scuro rgb(0, 15, 115) effettivo: arancione brillante rgb(255, 119, 51)
L'abbreviazione a 3 cifre duplica ogni cifra: #F73 → #FF7733 → rgb(255, 119, 51) Verificato dall'espansione live dello strumento mentre digita.
Convertire RGB di nuovo in hex richiede che il `toString(16)` di ogni canale sia left-padded a 2 cifre. Senza `padStart(2, '0')`, valori di canale a singola cifra producono hex non valido: `rgb(5, 87, 51)` verrebbe serializzato come `#55733` (5 caratteri) invece di `#055733` (6 caratteri). Molti convertitori ad-hoc saltano il pad e producono output rotto per qualunque canale sotto 16. L'idioma standard è `value.toString(16).padStart(2, '0')` per ciascuno di R, G, B.
Saltare padStart:
[5, 87, 51].map(v => v.toString(16)).join('') → '55733'
Produce hex non valido a 5 caratteri. Usare padStart(2, '0'):
[5, 87, 51].map(v => v.toString(16).padStart(2, '0')).join('') → '055733'
Hex valido a 6 caratteri; funziona correttamente per tutti i valori di canale 0-255. L'hex CSS a 8 cifre è `#RRGGBBAA` — l'alpha è la coppia *finale*. Alcune librerie colore (specialmente il vecchio `Color.parseColor()` di Android) usano l'ordinamento opposto `#AARRGGBB` con alpha come coppia *iniziale*, incompatibile con l'hex CSS. Un hex web `#FF573380` (arancione al 50% di alpha) interpretato come `#AARRGGBB` diventa alpha=255, R=87, G=51, B=128 — un ciano scuro a piena opacità. Verifichi sempre l'ordinamento alpha della piattaforma target prima del round-trip dell'hex a 8 cifre.
Incollare hex CSS a 8 cifre nel legacy Android Color.parseColor(): #FF573380 interpretato come #AARRGGBB → colore sbagliato e alpha completamente sbagliato.
Usi il formato documentato della piattaforma target: per Android Compose: Color(0xFFFF5733) con alpha come primo byte per CSS: #FF573380 con alpha come ultimo byte Non copi-incolli tra i due senza ri-ordinare.
I canali RGB sono gamma-encoded, non lineari. Mediare due valori RGB dà un punto medio percettivamente sbagliato. `(255, 0, 0)` mediato con `(0, 255, 0)` produce `(127, 127, 0)`, un oliva scuro fangoso, non il punto medio brillante giallo che ci si aspetterebbe mescolando luce rossa e verde. Per blending corretto, prima si decodifica in linear-RGB tramite la funzione di trasferimento sRGB (CSS Color 4 §11.2), si media in spazio lineare, poi si ricodifica. Oppure si lavora in OKLAB / OKLCH dove la distanza percettiva è uniforme.
Mediare RGB gamma-encoded direttamente: (rgb(255,0,0) + rgb(0,255,0)) / 2 = rgb(128, 128, 0) Sembra oliva scuro, non giallo brillante.
Mediare in linear-RGB: decodifica → linear-RGB → media → ricodifica → rgb(188, 188, 0) Giallo visibilmente brillante, corrispondente a ciò che produce la mescola fisica di luce.
Strumenti di conversione
Converti istantaneamente tra binario, esadecimale, decimale, ottale e qualsiasi base (2-36). Strumento online gratuito e privato: tutta l'elaborazione avviene nel tuo browser.
Strumenti di conversione
Converte HEX in RGB, HSL, OKLCH, OKLAB e CMYK direttamente nel browser — basta un clic per copiare qualsiasi formato. Gratuito, senza registrazione, i colori non lasciano mai la pagina.
Strumenti di conversione
Converte colori HEX in CMYK direttamente nel browser. Approssimazione ingenua basata su sRGB per proof di stampa. Gratuito, online, senza registrazione, i colori non lasciano mai la pagina.
Strumenti di conversione
Converte qualsiasi colore hex in HSL direttamente nel browser — supporta hex a 3, 6 e 8 cifre con alpha. Gratuito, istantaneo, online, senza registrazione, i colori non lasciano mai la pagina.
Strumenti di conversione
Converte HEX in OKLCH per i design token di Tailwind v4. Output live percettivamente uniforme con avvisi di gamma Display P3. Gratis, solo browser.
Strumenti di conversione
Comprimi JPEG, PNG e WebP fino all'80% in meno — nel tuo browser, senza upload. Batch di 20 immagini, regola la qualità, confronta prima e dopo. Gratuito e privato.