Vai al contenuto
Logo CrateX.app

CrateX.app

Selettore colori da immagine e palette

Scegli colori da un'immagine nel browser, copia HEX/RGB/CSS, crea una palette rappresentativa di 2-32 colori ed esporta variabili CSS o JSON con input HEIC/HEIF.

Trascina e rilascia l'immagine qui o clicca per selezionare

Supporta PNG / JPEG / WebP / AVIF / HEIC / HEIF

Numero di file

0 / 1

Dimensione totale

0 bytes / 25 MB

Limite per file

25 MB
Selettore colori da immagine e palette

Avvio rapido

1
Importa un’immagine
2
Clicca l’anteprima e copia HEX/RGB/CSS
3
Scegli dimensione palette (4/6/8/12/16/24/32)
4
Estrai colori rappresentativi
5
Esporta variabili CSS o JSON

Scenari comuni

Selezione colore design/poster

Estrai colori primari e di accento per schema colori

Tema/sistema di design

Esporta variabili CSS o JSON per progetto

Stile componenti

Estrai colori abbinati per pulsanti, tag, grafici

Coerenza del brand

Estrai palette colori standard da risorse del brand

Opzioni Selettore Colore e Palette

Conteggio dei colori: 2-32, comunemente 8/12; le foto/sfumature suggeriscono 16-32
Pulsanti preset: 4/6/8/12/16/24/32 cambio con un clic
Ordinamento: in base al numero di campioni quantizzati dal più alto al più basso, iniziando dai colori più comuni
Numero accanto al colore: mostra il conteggio dei campioni quantizzati dall'immagine della tavolozza sottocampionata
Contratto di esportazione: le variabili CSS usano nomi come :root { --color-1: ... }; JSON elenca index/hex/css/rgb/count per ciascun colore della palette.

Consigli d'uso

Inizia con 8/12 per vedere effetto complessivo, poi aumenta a 16/24/32 se necessario
Quando usi nel progetto, rinomina --color-1 in nomi semantici (es., --color-primary)
Mantieni pagina in primo piano durante estrazione immagini grandi per evitare limitazione browser

Limitazioni e compatibilità

Sottocampionamento automatico dell'estrazione della tavolozza per le prestazioni, i risultati sono colori rappresentativi.
Precisione: il campionamento dei clic utilizza una tela visualizzata fino a 2.048 px sul lato più lungo; l'estrazione della tavolozza utilizza un campione di 256 px.
HEIC/HEIF è solo input; la decodifica locale potrebbe non riuscire, quindi converti in PNG/JPEG se necessario.
Gestione alfa: CSS può esportare rgba(...); HEX/RGB non includono alfa; JSON conserva l'alfa nel valore CSS.
Limite di input: nessuna importazione da URL, nessuna importazione da incolla, nessuna pipetta dello schermo e nessun flusso con estensione del browser.
Limite del colore: nessuna conversione HSL/CMYK/Pantone/LAB/OKLCH, controllo del contrasto o matrice WCAG.
Limite di esportazione: nessuna esportazione di campioni Tailwind/SCSS/ASE/Figma/Procreate.

Privacy e sicurezza

Il prelievo dei colori dall’immagine e l’estrazione della palette avvengono nel browser. L’immagine sorgente resta nella memoria della pagina finché questo strumento è aperto. L’impostazione della dimensione della palette può restare nell’archiviazione del browser; se la sincronizzazione WebDAV è attiva, questa impostazione può sincronizzarsi secondo le tue impostazioni. Il colore scelto, la palette, il messaggio di errore e i dati di zoom / panoramica dell’anteprima sono uno stato di revisione runtime e possono sincronizzarsi anche tramite WebDAV state schema finché esistono. Il file immagine non viene sincronizzato per impostazione predefinita; entra nella sincronizzazione allegati WebDAV solo se la abiliti esplicitamente. Le esportazioni palette CSS/JSON vengono generate al download e non sono salvate come risultati separati. Su un dispositivo condiviso, cancella quando serve immagine, colori scelti, palette, impostazioni salvate e dati del sito.

Domande frequenti

5

Continua con questi strumenti correlati per il passaggio successivo.

Informazioni

Chi siamo
Prezzi

Note legali

Termini di servizio
Informativa sulla privacy
Informativa sui cookie

Preferenze

Gestisci i cookie

Tutta l'elaborazione degli strumenti avviene localmente nel tuo browser.