Fonda due colori con esclusione e calcoli il valore esadecimale
Il miscelatore per esclusione combina due colori esadecimali con questa modalità di fusione e restituisce il colore risultante esatto come valore hex normalizzato, canali RGB numerici e stringa RGB CSS pronta da copiare.
Esegui gratis nel browser
L’esclusione offre un’alternativa più delicata e meno contrastata rispetto alla modalità differenza: i colori chiari tendono a invertire l’altro valore, quelli scuri lo modificano meno e mezzitoni uguali possono avvicinarsi al grigio. Entrambi i dati vengono controllati prima del calcolo, perciò un colore mancante, errato o non supportato produce un messaggio chiaro invece di un risultato ambiguo.
Che cosa produce la modalità di fusione esclusione
L’esclusione confronta i due colori canale per canale, ma non si limita a calcolarne la media. Per ciascun canale rosso, verde e blu, lo strumento normalizza entrambi i valori, applica la relazione di esclusione e riconverte il risultato in un canale a otto bit. Il nero lascia invariato l’altro colore, mentre il bianco lo inverte. I valori compresi fra questi estremi creano un contrasto più moderato rispetto a quello generalmente prodotto dalla modalità differenza. L’esclusione è quindi utile quando Lei desidera un’interazione visibile tra i colori senza bordi aggressivi o una separazione tonale eccessiva. L’operazione è simmetrica: invertendo il primo e il secondo colore si ottiene lo stesso risultato. Lo strumento mostra le versioni normalizzate di entrambi gli input accanto all’output, così è possibile verificare esattamente il calcolo. Nella risposta viene indicata anche la modalità di fusione, informazione pratica quando il risultato viene archiviato con altre trasformazioni o confrontato in un flusso di progettazione automatizzato. Il canale alfa resta volutamente escluso: ogni input rappresenta un colore RGB opaco, per una risposta prevedibile e portabile.
Come vengono convalidati e calcolati gli input esadecimali
Inserisca ogni colore con tre o sei cifre esadecimali. Il simbolo # iniziale è facoltativo e sono accettate lettere maiuscole o minuscole. La notazione a tre cifre viene estesa prima del calcolo, quindi #369 diventa #336699. Non sono ammessi nomi di colori CSS, canali alfa, sintassi funzionale rgb(), commenti intorno al valore o stringhe solo parzialmente valide. Queste regole rigorose impediscono che un refuso venga interpretato silenziosamente come un colore diverso. Dopo la convalida, ogni canale usa l’equazione standard dell’esclusione: i due valori vengono sommati e si sottrae il doppio del loro prodotto diviso per 255. Il risultato viene arrotondato al canale intero più vicino per rappresentarlo come RGB convenzionale a otto bit ed esadecimale a sei cifre. Il calcolo non dipende dalla lingua, dalle impostazioni del dispositivo, dall’ora, da valori casuali o da servizi esterni. Gli stessi input restituiscono pertanto sempre gli stessi campi e valori JSON. Poiché entrambi i colori sono obbligatori, un campo mancante viene segnalato con il suo nome prima che sia prodotto qualsiasi risultato.
Come usare il risultato nel design e nello sviluppo
Usi il valore hex restituito ovunque sia accettato un colore CSS opaco, oppure copi la stringa RGB in un foglio di stile, un token di design, un’operazione canvas o un caso di test. L’oggetto RGB numerico separato è comodo per il codice che deve esaminare i canali senza analizzare nuovamente una stringa. La fusione per esclusione è utile per vedere in anteprima accenti sovrapposti di un’interfaccia, manifesti, livelli fotografici, arte generativa e stati al passaggio del puntatore quando serve un effetto differenza meno contrastato. Può inoltre offrire un riferimento deterministico per controllare se due sistemi di rendering concordano sui calcoli. La calcolatrice combina soltanto valori di colore: non compone trasparenze, non considera lo sfondo di un elemento, non converte profili colore e non riproduce ogni dettaglio di una specifica applicazione grafica. Per un confronto attendibile, mantenga l’output nello stesso flusso RGB dei colori sorgente. Il browser consente prove rapide, mentre una richiesta API costa $0.002 quando il calcolo fa parte di un processo ripetibile. Non richiedendo la rete, l’operazione è adatta anche a strumenti di build e test che esigono risultati stabili.
Casi d'uso
Visualizzare un contrasto più delicato
Calcoli il colore opaco creato dall’interazione per esclusione di due valori della tavolozza prima di applicare l’effetto a un layout.
Creare token di design deterministici
Generi un colore hex derivato e stabile per un tema, uno stato del componente, un sistema di illustrazione o una variabile CSS riutilizzabile.
Verificare i calcoli di fusione
Confronti un renderer o una pipeline grafica con un risultato RGB di esclusione esplicito, completo di input normalizzati e canali.
Domande frequenti
Quanto costa un calcolo tramite API?
Ogni richiesta API costa $0.002. Lo strumento nel browser può essere usato direttamente in questa pagina.
L’esclusione equivale alla modalità differenza?
No. Entrambe confrontano i canali, ma l’esclusione genera in genere un effetto più delicato e meno contrastato.
Quali formati di colore sono accettati?
Usi tre o sei cifre esadecimali con un simbolo # iniziale facoltativo, per esempio #369, 336699 o A0B1C2.
L’ordine dei due colori è importante?
No. L’equazione di esclusione è simmetrica, quindi invertire gli input produce lo stesso colore fuso.
Sono supportati i colori trasparenti?
No. Gli input sono colori RGB opachi; i valori esadecimali a quattro o otto cifre con alfa vengono rifiutati.
Perché un editor grafico può mostrare una lieve differenza?
Profili colore, flussi a luce lineare, trasparenza, sfondi di composizione e arrotondamenti specifici possono cambiare l’aspetto. Questa capacità usa calcoli RGB deterministici a otto bit.
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/exclusion \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color1":"#336699","color2":"#CC8844"}'const res = await fetch("https://api.kit.forhosting.com/color/exclusion", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color1": "#336699",
"color2": "#CC8844"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/exclusion",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color1": "#336699",
"color2": "#CC8844"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/exclusion", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color1":"#336699","color2":"#CC8844"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color1":"#336699","color2":"#CC8844"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/exclusion", 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
{
"color1": "#336699",
"color2": "#CC8844"
}Esempio di risposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.exclusion",
"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. |