Convertitore da OKLCH a HEX
Questo convertitore da OKLCH a HEX trasforma un colore con sintassi CSS in un valore esadecimale sRGB a sei cifre.
Esegui gratis nel browser
Segue un percorso numerico esplicito dalle coordinate cilindriche OKLCH a OKLab e RGB lineare, quindi limita i canali esterni al gamut sRGB visualizzabile. Il risultato è deterministico, adatto all’automazione e corredato dai valori RGB e OKLab, così Lei può verificare esattamente la conversione senza considerare il codice HEX finale una scatola nera.
Inserisca un colore OKLCH valido
Indichi il colore con la notazione funzionale CSS, ad esempio oklch(62.8% 0.258 29.23). La luminosità può essere una percentuale da 0% a 100% oppure un valore senza unità da 0 a 1. La croma deve essere pari o superiore a zero. La tonalità è interpretata in gradi quando non presenta un suffisso; sono accettati anche deg, grad, rad e turn. L’angolo può trovarsi fuori dall’intervallo da 0 a 360 perché viene normalizzato al valore equivalente. Il convertitore richiede tutte e tre le coordinate e non accetta alfa, la parola CSS none, virgole, input HEX o altre funzioni colore. Queste regole mantengono il contratto concentrato sulla produzione di un colore opaco a sei cifre e fanno fallire chiaramente i dati malformati, anziché trasformarli per supposizione in un risultato plausibile. Ogni componente numerico deve essere finito; Infinity e NaN vengono rifiutati prima del calcolo. Tale confine rigoroso è utile negli strumenti di build e nelle pipeline di dati, dove un formato imprevisto potrebbe propagare un colore del marchio errato in numerose risorse generate.
Comprenda il percorso di conversione
OKLCH descrive un colore mediante luminosità percettiva, croma e tonalità. Il convertitore normalizza la tonalità e risolve le coordinate cilindriche sugli assi a e b di OKLab tramite coseno e seno. Applica poi la trasformazione OKLab pubblicata per ottenere i canali sRGB lineari. Questi attraversano la curva di trasferimento sRGB standard e vengono quantizzati in valori interi rosso, verde e blu da 0 a 255. Ogni byte diventa esattamente due caratteri esadecimali, quindi il risultato principale ha sempre la forma #RRGGBB. La risposta comprende anche le coordinate OKLab risolte e i canali RGB interi. I valori intermedi aiutano a individuare le differenze fra un’applicazione grafica e una pipeline di codice. I numeri in virgola mobile vengono arrotondati solo nell’oggetto OKLab mostrato; il calcolo conserva l’intera precisione numerica di JavaScript fino ai byte RGB finali. L’algoritmo non usa rete, casualità, ora corrente, formattazione locale o stato mutabile: a parità di input produce quindi lo stesso JSON nell’API e nel browser.
Gestisca i colori esterni a sRGB
OKLCH può descrivere colori che i comuni schermi sRGB e la notazione HEX a sei cifre non riescono a rappresentare. Quando un canale RGB lineare calcolato scende sotto zero o supera uno, il convertitore lo porta al limite più vicino prima di applicare la curva sRGB. In questo caso la risposta imposta clamped su true. Il ritaglio è rapido e prevedibile, ma non è una strategia percettiva di mappatura del gamut: un input molto vivido può perdere sfumature, cambiare tonalità apparente o convergere su un canale completamente saturo. Consideri l’indicatore un invito a riesaminare il colore, soprattutto per palette di marca, token di accessibilità e gradienti in cui contano i rapporti fra colori vicini. Se clamped è false, tutti i canali erano già nel gamut sRGB. Se è true e la fedeltà visiva è importante, riduca la croma del valore OKLCH originale e ripeta la conversione finché il colore rientra. Questo comportamento esplicito evita calcoli non validi e assicura un HEX utilizzabile senza nascondere il compromesso. Il canale alfa non viene conservato perché un HEX a sei cifre rappresenta un colore opaco.
Casi d'uso
Esportare token di design
Converta palette percettive OKLCH in codici HEX stabili per sistemi che accettano soltanto colori sRGB a sei cifre.
Verificare una pipeline colore
Esamini RGB, OKLab e l’indicatore di ritaglio confrontando i risultati degli strumenti grafici e di sviluppo.
Generare CSS compatibile
Crei un fallback HEX deterministico per un colore OKLCH usato in fogli di stile, e-mail, modelli o client precedenti.
Domande frequenti
Quanto costa la conversione?
Può eseguirla gratuitamente nel browser di questa pagina, oppure pagare $0.002 per ogni richiesta API.
Perché il risultato indica clamped?
Almeno un canale sRGB lineare calcolato era fuori dall’intervallo visualizzabile ed è stato limitato a zero o uno prima della codifica.
È supportata la trasparenza alfa?
No. Il risultato è un HEX opaco a sei cifre, quindi un input OKLCH con componente alfa viene rifiutato.
Quali unità posso usare per la tonalità?
Può omettere l’unità per i gradi oppure usare deg, grad, rad o turn. Gli angoli vengono normalizzati tra zero e 360 gradi.
Perché un altro convertitore restituisce un HEX diverso?
Gli strumenti possono usare matrici, arrotondamenti o metodi gamut diversi. Qui trasformazione, ritaglio, curva sRGB e arrotondamento al byte sono fissi.
Per sviluppatori — accesso via API
Tutto quello che vedi in questa pagina è disponibile anche via API. Questa sezione è per i team che vogliono integrarlo nei propri sistemi; chi non ne ha bisogno può semplicemente usare lo strumento qui sopra.
Endpoint
Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.
Chiamala dal tuo stack
curl -X POST https://api.kit.forhosting.com/color/oklch-hex \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"text":"oklch(62.8% 0.258 29.23)"}'const res = await fetch("https://api.kit.forhosting.com/color/oklch-hex", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"text": "oklch(62.8% 0.258 29.23)"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/oklch-hex",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"text": "oklch(62.8% 0.258 29.23)"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/oklch-hex", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"text":"oklch(62.8% 0.258 29.23)"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"text":"oklch(62.8% 0.258 29.23)"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/oklch-hex", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Esempio di richiesta
{
"text": "oklch(62.8% 0.258 29.23)"
}Esempio di risposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.oklch_hex",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}L'API è asincrona: ricevi subito un task_id e puoi fare polling fino a 1 richiesta al secondo.
Prezzi
Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.
Errori
| HTTP | Codice | Significato |
|---|---|---|
401 | unauthorized | Chiave API mancante o non valida: controlla l'header Authorization. |
402 | insufficient_balance | Credito esaurito: ricarica per continuare a eseguire attività. |
404 | unknown_type | Tipo di attività sconosciuto: controlla il campo type della richiesta. |
429 | rate_limited | Troppe richieste in poco tempo: rallenta e riprova tra qualche secondo. |