ForHosting KIT · Immagini e foto

Miscelatore di colori

Miscelare #FF0000 e #0000FF al 50 % dà #800080, un viola con rosso 128, verde 0 e blu 128. Crei toni intermedi di marca e colori di stato a partire da due colori che ha già. Gratis nel Suo browser.

  • Gratis
  • Funziona nel suo browser
  • Senza registrazione
  • I suoi dati restano sul dispositivo
Usalo da WebAPIEmailTelegramApp presto
Se inserisce
Primo colore hex
#FF0000
Secondo colore hex
#0000FF
Proporzione
50
Ottiene
T
0,5
Cod. hex
#800080
Stringa RGB
rgb(128, 0, 128)

Un miscelatore di colori prende due codici hex e una percentuale di fusione, poi restituisce un solo colore situato tra di essi nello spazio dei canali RGB. I designer lo usano quando serve un tono intermedio tra un rosso di marca e un blu profondo, quando desiderano uno stato hover al trenta per cento verso un'evidenziazione, o quando generano rampe a gradini senza aprire una suite grafica desktop. I codici hex non validi falliscono con un errore chiaro di input non valido così che le pipeline possano intercettare refusi prima di pubblicare campioni errati.

Come funziona la miscela RGB e come scegliere la proporzione

Invii due colori hex e una proporzione da zero a cento. Internamente ogni colore è espanso in tre canali nell'intervallo da zero a duecentocinquantacinque. La forma breve a tre cifre, come cancelletto f zero zero, si espande a sei cifre raddoppiando ogni nibble, così cancelletto f zero zero e cancelletto FF0000 sono lo stesso rosso puro.

Prefissi opzionali di cancelletto o zero-x sono accettati e rimossi prima della validazione. L'RGB lineare non è un punto medio percettivo in LAB o HSL, quindi due colori di luminosità molto diversa possono apparire sbilanciati verso il genitore più chiaro; è il comportamento atteso di questo prodotto e coincide con l'interpolazione classica dei canali in stile CSS che molti script di design già usano.

Toni intermedi di palette di marca

Unisca un hex di marca primario con uno secondario al 25%, 50% e 75% per generare token intermedi a gradini per temi UI e kit di marketing.

Colori di hover e di stato

Misceli un colore base di pulsante con bianco o nero a una piccola proporzione per produrre stati hover più chiari e active più scuri senza scegliere ogni campione a mano.

Cosa succede se invio un codice hex non valido?

Entrambi i colori devono essere esadecimali a 3 o 6 cifre (# opzionale). Lunghezza errata o cifre non hex vengono rifiutate e non addebitate.

Il miscelatore di colori è gratuito?

Lo strumento del browser gira gratis sul Suo dispositivo.

La miscela avviene in HSL o LAB?

Gli spazi percettivi sono un'altra intenzione di prodotto; questo strumento segue le miscele classiche di canali hex.

Che colore si ottiene miscelando rosso e blu al 50 %?

Si ottiene #800080, un viola. Ogni canale si ferma a metà strada: il rosso scende da 255 a 128, il blu sale da 0 a 128 e il verde resta a 0.

Cosa indica la percentuale di miscela?

Indica quanto del secondo colore entra nella miscela. Con 0 ottiene il primo colore invariato, con 100 il secondo e con 50 il punto medio di ogni canale.

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.

POSThttps://api.kit.forhosting.com/color/mix

Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.

curl -X POST https://api.kit.forhosting.com/color/mix \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"color1":"#FF0000","color2":"#0000FF","ratio":50}'
{
  "color1": "#FF0000",
  "color2": "#0000FF",
  "ratio": 50
}
{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "color.mix",
  "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.

per richiesta$0.002

Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.

HTTPCodiceSignificato
401unauthorizedChiave API mancante o non valida: controlla l'header Authorization.
402insufficient_balanceCredito esaurito: ricarica per continuare a eseguire attività.
404unknown_typeTipo di attività sconosciuto: controlla il campo type della richiesta.
429rate_limitedTroppe richieste in poco tempo: rallenta e riprova tra qualche secondo.

Questa capacità esegue una miscela lineare deterministica su rosso, verde e blu in modo indipendente: con proporzione zero il risultato è color1 puro, a cento è color2 puro, e i valori intermedi interpolano ogni canale e arrotondano a passi interi 0–255.

Come funziona la miscela RGB e come scegliere la proporzione

La proporzione si interpreta come la percentuale di color2 nella miscela: canale uguale all'arrotondamento di color1 per uno meno t più color2 per t, dove t è la proporzione divisa per cento. Ciò significa che proporzione zero lascia color1 intatto, proporzione cento produce color2, e proporzione cinquanta si colloca a metà strada in RGB lineare per ogni canale. Input identici producono sempre JSON identico perché il percorso è aritmetica pura, senza rete, senza seme casuale e senza orologio di sistema.

Come leggere la risposta: hex, RGB e input riecheggiati

Usi hex quando le serve un singolo token per token di stile o file di tema; usi rgb quando un canvas, una libreria di grafici o un controllore di accessibilità si aspettano canali separati. In caso di successo la risposta riecheggia color1 e color2 normalizzati come hex a sei cifre in maiuscolo con cancelletto iniziale, la proporzione numerica inviata e t come intervallo unitario usato nel lerp. Il risultato miscelato appare in tre modi: hex come campione misto primario, rgb come oggetto con campi interi r g e b, e rgb_string come riga leggibile rgb parentesi aperta r virgola g virgola b parentesi chiusa da incollare in CSS o note di design. color1_rgb e color2_rgb espongono i canali genitore analizzati così le UI possono disegnare entrambe le estremità di un gradiente senza rianalizzare. L'etichetta method è sempre rgb_lerp affinché il codice a valle possa ramificare senza fiutare le forme. Mancanza di color1, di color2, di ratio, ratio fuori da zero a cento, e qualsiasi codice hex non valido falliscono con invalid_input e non vengono addebitati dopo il rifiuto del motore. I messaggi di errore nominano il campo così i client API possono mostrare una validazione di form precisa.

Uso dell'API, prezzi, flussi di design e limiti pratici

Chiami il miscelatore gratuito nel browser per schizzi di palette, esperimenti di tinta di marca e controlli rapidi di miscela intermedia senza installare uno strumento di design. È supportato solo l'input hex —i colori CSS con nome e le stringhe rgb tra parentesi sono fuori ambito— quindi normalizzi a monte se i dati di origine usano nomi. Invii un corpo JSON con i campi stringa obbligatori color1 e color2 più il numero obbligatorio ratio. Gli alias hex1, hex2, a, b, from, to, percent, amount e mix sono accettati quando documentati così i campi di form più vecchi si mappano in modo pulito. Usi l'API prepagata quando un generatore di temi, una pipeline di design system, un costruttore di campioni e-commerce o un servizio di asset di marketing necessita di un contratto stabile sotto saldo KIT a $0.002 per elemento riuscito; i fallimenti di validazione non consumano mai il saldo. Abbini questo endpoint a strumenti hex-to-HSL o di colori complementari quando il passo successivo è una palette completa, o a verificatori di contrasto quando il colore miscelato deve rispettare WCAG rispetto al testo. Gli autori che rilasciano SDK possono mappare hex e rgb direttamente in selettori di colore e tabelle di token che studenti e designer già si aspettano.

Pipeline di temi automatizzate

Gli script di design system chiamano l'API prepagata per unire due colori seme in token JSON bit-identici tra le esecuzioni di CI.

Come mischio due colori hex con questo miscelatore?

Invii JSON con color1, color2 e ratio (0–100). Esempio: color1 "#FF0000", color2 "#0000FF", ratio 50 restituisce la miscela intermedia RGB come campi hex e rgb.

Cosa significa la percentuale di proporzione?

Ratio è la percentuale di color2 nella miscela. 0 mantiene color1 puro, 100 produce color2 puro e 50 è una miscela lineare pari di ogni canale RGB.

Leggi la documentazione completa del KIT →