Selettore colore e ruota cromatica

Nome più vicino: dodgerblue
Su bianco 3.31:1 (AA Large) · Su nero 6.35:1 (AA)

Armonie cromatiche

Complementare
Analogo
Triadico
Complementare diviso
Tetradico
Monocromatico
Anteprima del risultato di «Selettore di colori»

Selettore colore dall'immagine: ottieni codici colore HEX e RGB

Seleziona un pixel per leggere i valori HEX, RGB e HSL oppure esporta una tavolozza dominante come variabili JSON o CSS.

Trascina un'immagine — clicca un pixel per ottenerne il codice colore o estrai l'intera palette

PNG, JPG, WEBP, GIF

Cosa puoi fare con Selettore di colori

Esamina le funzionalità principali prima di iniziare.

  • Preleva qualsiasi colore da una foto in HEX, RGB o HSL
  • Estrai la palette dei colori dominanti da un'immagine
  • Preleva i colori del brand da uno screenshot o da un logo
  • Copia i codici colore per i tuoi progetti
  • Esporta la palette in JSON o come variabili CSS
  • Crea una palette di colori partendo da una foto di riferimento

Riferimento alle impostazioni

Controlli disponibili per Selettore di colori.

Modalità di elaborazionePreimpostazioni
Elabora un singolo elemento oppure passa alla modalità batch di Premium per applicare le stesse impostazioni a più elementi. I tipi di input disponibili dipendono dallo strumento.Opzioni: Immagine singolaIn blocco

Selettore colore e ruota cromatica

CasualeCon un clic
Passa a un nuovo colore casuale con un clic per trovare subito ispirazione; i valori HEX, RGB, HSL e le palette armoniche si aggiornano tutti insieme.
Saturazione e luminositàCursoreIntervallo: 0–100%
Trascina l'indicatore nel quadrato per impostare quanto è vivido il colore (da sinistra a destra) e quanto è chiaro o scuro (dall'alto in basso).
TonalitàCursoreIntervallo: 0–360 · Predefinito: 211
Scorri lungo la barra arcobaleno per scegliere la tonalità di base, passando dal rosso al giallo, al verde, al blu e al magenta fino a tornare al rosso.
HEXInserimento testo
Digita o incolla un valore di colore qualsiasi — un codice HEX, una notazione rgb() o hsl() o un nome di colore CSS — per passare subito a quel colore esatto.
RGBCampo numericoIntervallo: 0–255
Imposta singolarmente i canali rosso, verde e blu da 0 a 255 quando devi riprodurre un valore RGB esatto indicato in una specifica di design.
HSLCampo numericoIntervallo: 0–360
Regola tonalità (0–360), saturazione e luminosità (0–100) come valori numerici: utile per rendere un colore più chiaro o più tenue senza cambiarne la tonalità.

Palette dominante

DimensioneMenu a discesa
Sceglie quanti colori dominanti estrarre dall'immagine caricata (predefinito 8); scegli un numero ridotto per una palette di brand essenziale o un numero alto per far emergere le sfumature d'accento.Opzioni: 58101624
Colore selezionatoSelettore colore
Clicca o tocca un punto qualsiasi della foto caricata per campionare quel pixel esatto; ogni selezione aggiunge un campione con i valori HEX, RGB e HSL, rimovibile singolarmente o tutto insieme.
Uso gratuito · Nessuna registrazione richiesta · Senza filigranaI caricamenti sono crittografati durante il transitoRimosso in base ai nostri criteri di conservazione

Domande frequenti

Come Selettore di colori ti aiuta a portare a termine il lavoro

Problemi reali che risolve ogni giorno: per aziende, creatori e attività quotidiane. Trova il caso d'uso adatto a te e inizia.

Per i creativi

Audit dell'identità del marchio

Estrai i valori HEX esatti da un logo o da un asset di marketing esistente da inserire nella tua guida di stile. Abbina i colori del brand dei concorrenti per una presentazione di posizionamento o un pitch.

Per i creativi

Creazione di palette per il web design

Estrai i colori dominanti da una fotografia o da una mood board, esportali come variabili CSS e inseriscili nel tuo foglio di stile. L'intervallo ideale di 5-8 colori copre primari, accenti e neutri, fornendo una base completa per un design system.

Per l'e-commerce

Schede prodotto e-commerce

Abbina i colori di sfondo delle foto prodotto al tema del tuo negozio. Estrai il colore d'accento dominante dalla foto di una sneaker o di un vestito e usalo come elemento in evidenza dell'inserzione.

Uso personale

Ispirazione per interni e moda

Fotografa una stanza o un outfit che ti piace ed estraine la palette. Usala per scegliere vernici, tessuti o accessori che si abbinano allo schema esistente, trasformando l'ispirazione visiva in campioni concreti da usare.

Per gli sviluppatori

Schemi per la visualizzazione dei dati

Genera una palette categoriale di 10-16 colori ricavati da un'immagine che vuoi evocare (ad esempio un acquerello per un grafico delicato, un tramonto per sfumature dal caldo al freddo). Meglio che scegliere tonalità generiche.

Per i creativi

Flussi di lavoro per asset di gioco e interfaccia

Estrai la palette di colori indicizzati da sprite art o mockup di UI per importarla in uno strumento di pixel art o in un motore di gioco. L'esportazione della palette in JSON si integra con Aseprite, Photoshop e la maggior parte delle pipeline di asset.

Per gli sviluppatori

Controlli di contrasto WCAG prima del rilascio

Imposta una coppia di colori di testo e sfondo nel Selettore e Ruota dei colori autonomo e leggi all'istante il loro rapporto di contrasto rispetto al bianco e al nero, così da individuare un problema di accessibilità AA/AAA prima che arrivi in produzione.

Per i creativi

Regola con precisione i colori personalizzati di vernice e stampa

Salta del tutto la foto: digita un valore esatto HEX, RGB o HSL, oppure trascina i controlli di saturazione/tonalità, per fissare una specifica miscela di vernice, un colore spot o un tono del marchio, poi controlla il colore con nome più vicino per comunicare facilmente con un fornitore.

Per i creativi

Tavole colore multipunto da una sola foto

Clicca su più punti di una singola foto di riferimento — un cielo, un vestito, un fiore — per costruire un set di campioni multicolore curato invece di affidarti alla palette dominante estratta automaticamente, poi esportalo come JSON o CSS per la mood board di un cliente.

Marketing

Set di armonie di colori del brand istantanei

Inserisci un codice HEX del marchio per calcolare i campioni complementari, triadici e complementari suddivisi per la revisione in un modello social o in una tavolozza di annunci.

Web e SEO

Estrai una palette di design token da uno screenshot di un concorrente

Carica uno screenshot del sito web o dell'app di un concorrente invece di una foto, e l'estrattore di palette dominante ne ricava gli esatti colori di sfondo, d'accento e del testo come codici HEX che puoi esportare come variabili CSS — un modo rapido per ricostruire uno schema di colori per un mockup o una presentazione.

Guarda ogni trasformazione applicarsi

Ogni foto attraversa la barra senza modifiche e ne esce dall'altro lato già completata.