Miscelatore Colore

Un mixer di colori fonde due colori in uno nuovo e ti mostra il risultato in HEX, RGB e HSL Gli dai un primo colore e un secondo colore in qualsiasi sintassi comune (un codice esadecimale come #4466EE, un valore rgb () o hsl () o un nome CSS come corallo), scegli quanto del secondo colore piegare e calcola istantaneamente il colore misto Costruisce anche un gradiente di passaggi intermedi tra i due colori, in modo da poter vedere l'intera transizione anziché un singolo punto medio.

La striscia sfumata funge anche da grafico del mixer a colori Entra #FF0000 e #0000FF, imposta i passaggi Gradiente su 3 e premi Mix Colours: la striscia mostra cinque campioni, #FF0000, #BF0040, #800080, #4000BF e #0000FF, e il risultato misto con un rapporto del 50% è #800080 Come mixer di colore primario mescola la luce, non la vernice Il rosso e il giallo danno l'arancione #FF8000, ma il blu e il giallo danno il grigio #808080 piuttosto che il verde che darebbe una scatola di vernice Non c'è vista del mixer della ruota di colore, solo i due colori che inserisci e i passaggi tra di loro.

Il mix diretto è una media ponderata: con un rapporto del 50% ogni colore contribuisce equamente e lo strumento interpola linearmente ciascun canale rosso, verde e blu tra i due ingressi. Fai scorrere il rapporto verso 0 e mantieni il primo colore; fatelo scorrere verso 100 e atterrerete sul secondo. Questo è lo stesso CSS matematico utilizzato per un gradiente a due stop, motivo per cui il punto medio di un gradiente dal rosso al blu è il viola riportato da questo strumento.

Al di là di una semplice miscela, il mixer offre sei modalità di fusione separabili definite nella specifica W3C Compositing and Blending (moltiplica, schermo, sovrapposizione, oscuramento, schiarimento e differenza) più una media semplice Queste sono le stesse operazioni che gli editor di immagini come Photoshop e GIMP applicano tra i livelli Moltiplica sempre si scurisce (il rosso per il blu è nero), lo schermo si schiarisce sempre (il rosso sul blu è magenta) e la differenza ti dà la distanza canale per canale tra due colori Il rapporto agisce quindi come l'opacità del livello, controllando quanto fortemente il risultato della miscela viene applicato sul primo colore.

Tutto viene eseguito lato client nel browser I colori immessi non escono mai dalla scheda e, poiché la matematica dei colori è aritmetica semplice, lo strumento funziona offline una volta caricata la pagina, I progettisti raggiungono un mixer per trovare un colore a metà strada tra un marchio primario e un neutro, per costruire scale di tinta e accento o per visualizzare in anteprima come due livelli si combineranno prima di impegnarsi in un file di progettazione Gli sviluppatori lo usano per generare stop gradienti, calcolare gli stati di passaggio del mouse e tradurre un risultato misto direttamente in un valore HEX o HSL che possono incollare in CSS.