Distanza colore-complementare
La distanza tra colore e complementare trasforma una nota relazione del cerchio cromatico in una misura riproducibile.
Esegui gratis nel browser
Inserisca un colore esadecimale o RGB: il calcolatore ricava il suo complementare HSL esatto a 180 gradi, converte entrambi da sRGB a CIELAB D65 e restituisce la separazione Delta E 76. Un indice normalizzato permette di ordinare e confrontare facilmente i risultati; colore originale, complementare, canali RGB, codici esadecimali e coordinate Lab rendono verificabile ogni passaggio. La convalida rigorosa rifiuta dati incompleti o fuori intervallo senza modificarli silenziosamente.
Inserisca un colore e ne definisca il complementare con coerenza
Invii un colore mediante un codice esadecimale di tre o sei cifre, un’espressione rgb(r, g, b) oppure tre canali RGB separati da virgole. Il cancelletto iniziale e l’uso di maiuscole o minuscole nelle cifre esadecimali non cambiano il risultato. I canali RGB devono essere numeri interi da 0 a 255: sintassi errata, percentuali, decimali, canali mancanti e valori esterni all’intervallo sRGB visualizzabile vengono quindi respinti come input non valido. Dopo l’analisi, il calcolatore converte i canali RGB originali in HSL e ruota la tonalità di esattamente 180 gradi, mantenendo saturazione e luminosità. Questa definizione coincide con il classico punto opposto sul cerchio HSL e rende esplicita l’operazione, senza affidarsi a valutazioni artistiche nascoste. Prima della misurazione, il valore HSL ruotato viene riconvertito in canali sRGB interi, corrispondenti ai colori che schermi comuni e flussi CSS possono effettivamente rappresentare. Gli input acromatici sono un caso significativo: il grigio ha saturazione zero, quindi ruotarne la tonalità nominale non genera un colore visivamente diverso. Il suo complementare resta lo stesso grigio e la distanza misurata è zero. Input uguali producono sempre output uguali perché il calcolo non utilizza rete, casualità, orologio, ricerca di profili o stato nascosto.
Legga la distanza Lab e l’indice di armonia
La risposta presenta l’originale normalizzato e il complementare come valori esadecimali maiuscoli a sei cifre, canali RGB interi e coordinate CIELAB. La conversione linearizza anzitutto i canali sRGB standard, li trasforma in CIE XYZ mediante la matrice sRGB convenzionale, utilizza il bianco di riferimento D65 adottato da sRGB e applica la funzione di trasferimento CIELAB. Il valore delta_e_76 è la distanza euclidea fra le due terne Lab: zero significa che i colori visualizzati coincidono, mentre valori maggiori indicano una separazione percettiva più ampia secondo questo modello. Delta E 76 viene impiegato intenzionalmente perché il servizio misura una singola coppia deterministica, senza pesi di tolleranza specifici di un settore. harmony_strength traduce la distanza in una pratica scala da 0 a 100, dividendo Delta E per due e limitando il risultato a 100. È un indicatore comparativo, non una legge universale di bellezza. Le etichette agevolano la classificazione: meno di 15 è debole, da 15 a meno di 35 moderata, da 35 a meno di 65 forte e 65 o più molto forte. I complementari saturi ottengono spesso punteggi alti, mentre colori tenui e neutri tendono a valori inferiori. Conservi delta_e_76 quando serve la misura di base e usi punteggio o etichetta per pannelli, filtri e semplici regole grafiche.
Usi la metrica con criterio nei sistemi di design
Il calcolatore è utile quando un generatore di palette, un creatore di temi, un sistema per grafici o una pipeline di token di marca richiede più del solo codice esadecimale complementare. Il Suo team può ricavare complementari secondo una convenzione stabile, ordinare i colori sorgente in base alla separazione percettiva prodotta e archiviare le coordinate Lab con i token generati per successive verifiche. Il prezzo API è $0.002 per elemento riuscito, mentre l’esecuzione nel browser consente rapidi controlli interattivi. Gli errori di convalida impediscono che stringhe colore difettose diventino dati di palette apparentemente plausibili. Non confonda la forza dell’armonia con il contrasto accessibile: Delta E stima la differenza cromatica, mentre un testo leggibile richiede un calcolo del contrasto di luminanza che consideri dimensione e contesto. Nemmeno un punteggio molto forte garantisce l’idoneità per un marchio, una cultura, uno stato dell’interfaccia o un processo di stampa. Qui si opera con display sRGB; colori di stampa, tinte piatte, valori ad ampia gamma e campioni misurati richiedono prima un profilo colore gestito esplicitamente. Consideri il risultato un segnale da affiancare a contrasto, gerarchia, equilibrio della saturazione e revisione umana. Se occorre riproducibilità, registri il campo method: identifica l’intero percorso di rotazione HSL, CIELAB D65 e Delta E 76, evitando di confondere il punteggio con CIE94, CIEDE2000 o un’altra regola complementare.
Casi d'uso
Ordinare colori di accento generati
Misuri ogni colore del marchio rispetto al complementare derivato e privilegi le coppie con la separazione percettiva desiderata.
Verificare la generazione dei token
Archivi valori esadecimali, RGB e Lab normalizzati, metodo e distanza per riprodurre e controllare in seguito un token complementare.
Insegnare le relazioni cromatiche
Mostri perché i colori saturi e i grigi neutri reagiscono diversamente quando si misura la stessa rotazione della tonalità di 180 gradi.
Domande frequenti
Come viene calcolato il complementare?
La sorgente passa da sRGB a HSL, la tonalità ruota di 180 gradi, saturazione e luminosità restano fisse e il risultato torna a sRGB intero.
Che cosa indica Delta E 76?
È la distanza in linea retta tra originale e complementare in CIELAB. Zero indica nessuna separazione Lab; valori maggiori rappresentano una più ampia separazione percettiva modellata.
Come si ottiene la forza dell’armonia?
Il calcolatore divide Delta E 76 per due e limita il risultato a 100. È un indicatore comparativo coerente, non una valutazione estetica oggettiva.
Un punteggio alto garantisce un contrasto accessibile?
No. Distanza percettiva e contrasto di luminanza rispondono a domande diverse. Usi un calcolatore di contrasto WCAG per testi e accessibilità delle interfacce.
Quanto costa un calcolo tramite API?
Ogni elemento API elaborato correttamente costa $0.002. Gli input non validi vengono respinti chiaramente, senza essere ricondotti silenziosamente all’intervallo.
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/complement-distance \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#336699"}'const res = await fetch("https://api.kit.forhosting.com/color/complement-distance", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#336699"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/complement-distance",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#336699"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/complement-distance", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#336699"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#336699"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/complement-distance", 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
{
"color": "#336699"
}Esempio di risposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.complement_distance",
"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. |