Genera 17 palette di colori da un unico colore base

Scegli un colore base e genera 17 palette armoniose. Monocromatica, complementare, triadica, pastello, scura e altre - tutti i calcoli vengono eseguiti localmente nel tuo browser.

Palette monocromatica

Tutti i colori hanno la stessa tonalità (H) e variano principalmente in luminosità (L) nello spazio colore HSL.

#0b28ba

hsl(230, 89%, 39%)

#153af2

hsl(230, 89%, 52%)

#4f6bf5

hsl(230, 89%, 64%)

#899cf8

hsl(230, 89%, 76%)

#c3ccfc

hsl(230, 89%, 88%)

Palette triadica

Tre tonalità separate da 120 sulla ruota dei colori (vertici di un triangolo equilatero) una geometria spesso utilizzata nel branding e nei design ispirati al Bauhaus.

#4f6bf5

hsl(230, 89%, 64%)

#f43757

hsl(350, 89%, 59%)

#7ff667

hsl(110, 89%, 69%)

#f87f94

hsl(350, 89%, 74%)

#42f21f

hsl(110, 89%, 54%)

Palette complementare divisa

Una variante della palette complementare: invece di un complemento (180), si usano due colori spostati di circa ±30 dal complemento, riducendo la tensione visiva ma mantenendo un forte contrasto.

#4f6bf5

hsl(230, 89%, 64%)

#f5864f

hsl(20, 89%, 64%)

#bef54f

hsl(80, 89%, 64%)

#f7a176

hsl(20, 89%, 72%)

#b0f328

hsl(80, 89%, 56%)

Palette pastello

La stessa tonalità con saturazione ridotta e luminosità aumentata uno spostamento verso il centro e la parte alta dello spazio HSL che produce colori morbidi e “cremosi”.

#e1e5f4

hsl(230, 45%, 92%)

#d3d7ee

hsl(230, 45%, 88%)

#c4cae9

hsl(230, 45%, 84%)

#b5bde3

hsl(230, 45%, 80%)

#a6b0dd

hsl(230, 45%, 76%)

Palette scura

La stessa tonalità con alta saturazione (S) e luminosità ridotta (L) uno spostamento verso il basso dell’asse di luminosità, che produce colori profondi tipici della dark mode e degli accenti forti.

#3757f4

hsl(230, 89%, 59%)

#153af2

hsl(230, 89%, 52%)

#0c2dd2

hsl(230, 89%, 44%)

#0a25ab

hsl(230, 89%, 36%)

#081d85

hsl(230, 89%, 28%)

Palette tonale (ispirata a Material Design)

Diversi livelli di luminosità di una stessa tonalità L variata e S moderata, simile alle gamme tonali delle linee guida Material Design (es. 50-900).

#f2f3f8

hsl(230, 27%, 96%)

#dcdfef

hsl(230, 36%, 90%)

#b1bae7

hsl(230, 54%, 80%)

#7c8ee9

hsl(230, 71%, 70%)

#3e5df4

hsl(230, 89%, 60%)

Palette minimalista (ispirata ad Apple)

Un accento di colore vivace e diversi neutri molto chiari e delicati, una composizione tipica di interfacce con molto spazio bianco e ombre sottili.

#3e5df4

hsl(230, 89%, 60%)

#fafafa

hsl(230, 6%, 98%)

#efeff1

hsl(230, 6%, 94%)

#dfdfe2

hsl(230, 6%, 88%)

#484951

hsl(230, 6%, 30%)

Palette analoga

Colori con tonalità simili, da circa -30 a +30 intorno al colore base sulla ruota dei colori classica (es. Itten).

#4fbef5

hsl(200, 89%, 64%)

#67a3f6

hsl(215, 89%, 69%)

#4f6bf5

hsl(230, 89%, 64%)

#4637f4

hsl(245, 89%, 59%)

#864ff5

hsl(260, 89%, 64%)

Palette complementare

Il colore base e il suo complemento spostato di 180 sulla ruota dei colori uno dei contrasti fondamentali descritti da Johannes Itten.

#4f6bf5

hsl(230, 89%, 64%)

#1f42f2

hsl(230, 89%, 54%)

#f5d94f

hsl(50, 89%, 64%)

#f8e37f

hsl(50, 89%, 74%)

#f2cf1f

hsl(50, 89%, 54%)

Palette tetradica (quadrata)

Quattro tonalità distanziate di 90 sulla ruota dei colori (vertici di un quadrato) ricca ed equilibrata, ideale per temi UI complessi e visualizzazione dati.

#4f6bf5

hsl(230, 89%, 64%)

#f54fbe

hsl(320, 89%, 64%)

#f5d94f

hsl(50, 89%, 64%)

#4ff586

hsl(140, 89%, 64%)

#97a8f9

hsl(230, 89%, 79%)

Palette toni caldi

Colori spostati verso l'estremità calda dello spettro (rossi, aranci, gialli) evoca energia, calore e accessibilità.

#f3d026

hsl(50, 89%, 55%)

#e7f548

hsl(65, 89%, 62%)

#c6f665

hsl(80, 89%, 68%)

#e8e00d

hsl(58, 89%, 48%)

#e5f886

hsl(70, 89%, 75%)

Palette toni freddi

Colori spostati verso l'estremità fredda dello spettro (blu, turchese, viola) comunica calma, professionalità e fiducia.

#0e34f1

hsl(230, 89%, 50%)

#4434f3

hsl(245, 89%, 58%)

#0c62d9

hsl(215, 89%, 45%)

#565cf5

hsl(238, 89%, 65%)

#0a3fb7

hsl(222, 89%, 38%)

Palette toni terra

Marroni, oliva e ocra a bassa saturazione ispirati ai paesaggi naturali perfetta per marchi ecologici e estetica rustica.

#9b9b4b

hsl(60, 35%, 45%)

#a3af6a

hsl(70, 30%, 55%)

#88813a

hsl(55, 40%, 38%)

#a6b686

hsl(80, 25%, 62%)

#a5ac53

hsl(65, 35%, 50%)

Palette neon vibrante

Colori a saturazione massima con intensità elettrica progettata per marketing audace, interfacce gaming e design d'impatto.

#1a40ff

hsl(230, 100%, 55%)

#330aff

hsl(250, 100%, 52%)

#2994ff

hsl(210, 100%, 58%)

#7f06f9

hsl(270, 95%, 50%)

#15d4f9

hsl(190, 95%, 53%)

Palette vintage smorzata

Toni desaturati e leggermente caldi che ricordano stampe antiche e fotografia retro ideale per marchi con eredità e estetica nostalgica.

#7c87c1

hsl(230, 36%, 62%)

#9c8ac2

hsl(260, 31%, 65%)

#69a2bf

hsl(200, 40%, 58%)

#bc98c3

hsl(290, 27%, 68%)

#65b3a6

hsl(170, 34%, 55%)

Palette alto contrasto

Gamma estrema di luminosità dal quasi nero al quasi bianco con la tonalità base eccellente per design accessibili e forte gerarchia visiva.

#030a30

hsl(230, 89%, 10%)

#081f91

hsl(230, 89%, 30%)

#0e34f1

hsl(230, 89%, 50%)

#869af8

hsl(230, 89%, 75%)

#f3f4f6

hsl(230, 15%, 96%)

Palette gradiente tramonto

Una rotazione fluida delle tonalità da toni caldi a freddi, imitando un tramonto naturale ideale per sezioni hero, sfondi e progetti creativi.

#2648f3

hsl(230, 89%, 55%)

#6434f3

hsl(255, 89%, 58%)

#a917f2

hsl(280, 89%, 52%)

#e80dd6

hsl(305, 89%, 48%)

#d90c73

hsl(330, 89%, 45%)

Generare palette da un singolo colore

Il generatore di palette crea 17 palette diverse da un singolo colore base, basandosi sulla teoria dei colori. Ogni palette ha una composizione diversa - dalle variazioni monocromatiche ai colori complementari contrastanti.

Tutti i calcoli si basano sullo spazio colore HSL (tonalità, Saturazione, luminosità). La tonalità determina il colore base, la saturazione l'intensita e la luminosità il carattere chiaro o scuro. Questo modello corrisponde alla percezione umana dei colori e si presta perfettamente alla generazione di palette.

Come usare il generatore

La generazione richiede solo pochi secondi:

1. Scegli il colore base
Inserisci un codice HEX o usa il selettore di colori.
2. Visualizza le palette
Lo strumento genera automaticamente 17 palette con diversi colori armoniosi.
3. Copia i codici HEX
Clicca su un colore per copiare il suo codice HEX. Usalo in CSS, Figma o altri strumenti.

17 tipi di palette – quale si adatta al tuo progetto?

Il generatore crea 17 schemi cromatici basati sulla teoria del colore. Ogni schema segue una logica diversa:

Palette monocromatica
Diverse gradazioni di luminosità di un unico colore. Le tinte risultano coerenti e ordinate. Adatta a relazioni aziendali, siti istituzionali e progetti che richiedono sobrietà visiva.
Palette analoga
Colori adiacenti sul cerchio cromatico (circa 30° di distanza). Transizioni morbide senza stacchi netti. Apprezzata per illustrazioni, blog e materiali editoriali.
Palette complementare
Il colore base e il suo opposto sul cerchio cromatico (180°). Genera il contrasto visivo più forte. Utile per pulsanti di azione, banner promozionali e elementi che devono catturare lo sguardo.
Palette triadica
Tre colori distanziati di 120° formano un triangolo equilatero. Combinazione vivace ed equilibrata. Funziona bene per l'identità di marchi creativi e campagne pubblicitarie.
Palette complementare divisa
Invece del complementare diretto si usano i suoi due vicini. Il contrasto resta evidente ma meno aggressivo. Una scelta sicura quando lo schema complementare appare troppo intenso.
Palette pastello
Saturazione bassa e luminosità alta producono toni morbidi e delicati. Frequente nella cosmetica, nella moda per bambini e nella pasticceria artigianale.
Palette scura
Saturazione alta e luminosità bassa. Tinte profonde e intense per interfacce in modalità scura, marchi premium e prodotti che puntano sull'esclusività.
Palette tonale
Una scala di luminosità della stessa tonalità, dal molto chiaro al molto scuro. Corrisponde ai livelli di colore dei design system (es. da 50 a 900). Indispensabile per costruire librerie di componenti UI.
Palette minimalista
Un accento cromatico deciso circondato da neutri chiari. Stile tipico delle pagine prodotto e delle landing page contemporanee con ampio spazio bianco.
Palette tetradica (quadrata)
Quattro tonalità a 90° di distanza sul cerchio cromatico. Ricca e bilanciata – particolarmente adatta a dashboard, visualizzazioni dati e interfacce complesse che necessitano di molti colori distinti.
Palette calda
Tonalità spostate verso rossi, arancioni e gialli. Trasmette energia, calore e cordialità. Diffusa nella ristorazione, nell'ospitalità e nelle campagne marketing dinamiche.
Palette fredda
Tonalità spostate verso blu, turchesi e viola. Comunica calma, professionalità e fiducia. Presente nel fintech, nella sanità e nel branding aziendale.
Palette terre
Marroni, oliva e ocra poco saturi ispirati ai paesaggi naturali. Adatta a marchi biologici, prodotti artigianali e un'estetica rustica e autentica.
Palette neon
Colori a saturazione massima con intensità elettrica. Pensata per marketing audace, interfacce gaming, brand della nightlife e design che esigono attenzione immediata.
Palette vintage
Toni desaturati e lievemente caldi che ricordano stampe antiche e fotografia retrò. Ideale per marchi storici, prodotti artigianali e un'estetica nostalgica.
Palette alto contrasto
Escursione di luminosità estrema dal quasi nero al quasi bianco con la tonalità di base. Eccellente per design accessibili, gerarchia visiva forte e interfacce conformi WCAG.
Palette tramonto
Rotazione fluida delle tonalità dal caldo al freddo, ispirata ai tramonti naturali. Perfetta per sezioni hero, sfondi sfumati e progetti creativi.

Esempio: HSL(210, 80%, 50%)

H = 210 gradi (tonalità blu)

S = 80% (intenso)

L = 50% (luminosità media)

Stessa tonalità, luminosità diversa

L: 90% → 70% → 50% → 30% → 10%

Come funziona lo spazio colore HSL

Tutte le palette di questo strumento si basano sullo spazio colore HSL (tonalità, Saturazione, luminosità). A differenza di HEX o RGB, HSL descrive i colori come li percepiamo:

Hue (H) - la tonalità nel cerchio cromatico (0-360 gradi). 0 = rosso, 120 = verde, 240 = blu.
Saturation (S) - l'intensita. 0% = grigio, 100% = colore completamente saturo.
Lightness (L) - la luminosità. 0% = nero, 50% = colore normale, 100% = bianco.

Modificando selettivamente questi valori si ottengono palette armoniose. Le palette monocromatiche variano solo L, le analoghe solo H, e le complementari invertono H di 180 gradi.

Il colore nell'arte e nel design italiano

L'Italia ha plasmato il linguaggio del colore per secoli. Nel Rinascimento, Tiziano Vecellio sviluppò la tecnica della velatura - strati sottilissimi di pigmento trasparente sovrapposti per creare profondità e luminosità. Leonardo da Vinci perfezionò lo sfumato, una transizione graduale tra i toni che elimina i contorni netti. Raffaello combinava rosa tenui, azzurri e ori in composizioni equilibrate. Questi principi di transizione cromatica si ritrovano nei gradienti e nelle palette tonali del design digitale moderno.

Il Futurismo italiano portò una nuova energia cromatica. Giacomo Balla e Umberto Boccioni usavano colori puri e contrastanti per rappresentare velocità e dinamismo. Rosso acceso accanto a blu elettrico, giallo brillante su fondi neri. Queste combinazioni audaci dimostrano che i contrasti forti possono trasmettere movimento ed emozione senza creare confusione visiva.

I maestri vetrai di Murano lavorano il colore da oltre settecento anni. I rossi rubino ottenuti con oro colloidale, i blu cobalto e gli ori a foglia sono tonalità uniche, impossibili da replicare con altri materiali. Questa tradizione artigianale insegna che ogni mezzo - vetro, schermo, carta - ha una propria gamma cromatica. Il generatore di palette lavora nello spazio HSL digitale, ma le armonie che produce si ispirano agli stessi principi di equilibrio tra tonalità, saturazione e luminosità.

Simbolismo dei colori nella cultura italiana

Il verde, il bianco e il rosso del tricolore italiano derivano dalla bandiera della Repubblica Cispadana del 1797. Il verde rappresenta la speranza, il bianco la fede, il rosso l'amore. Nel branding rivolto al mercato italiano, questa combinazione evoca immediatamente italianità, qualità e tradizione. Molti marchi alimentari e del made in Italy la utilizzano come riferimento cromatico diretto o indiretto.

Ogni regione italiana ha una propria identità cromatica. La Toscana si riconosce nei toni della terra di Siena, dell'ocra e del verde oliva. La Sicilia porta arancioni vivaci, gialli solari e blu del Mediterraneo. La Liguria combina il rosa dei palazzi di Portofino con il turchese del mare. Queste palette regionali offrono ispirazione concreta per progetti di design legati al turismo, all'enogastronomia e al lifestyle.

Le festività italiane hanno codici cromatici precisi. Il Natale italiano privilegia rosso intenso, oro e verde scuro. Il Carnevale di Venezia esplode con oro, viola, blu royal e cremisi - colori che richiamano le maschere e i costumi storici. La Pasqua si esprime con pastelli delicati: giallo primula, rosa cipria, verde menta e lilla. Conoscere questi riferimenti culturali aiuta a creare schemi di colori che parlano al pubblico italiano.

Il colore nel branding e nel mercato italiano

La moda milanese guida le tendenze cromatiche globali. Ogni stagione, le sfilate di Milano lanciano colori che migrano dal tessuto al design digitale in pochi mesi. Il nero elegante resta il pilastro del lusso italiano - Armani, Prada e Valentino lo usano come base senza tempo. Il rosso Valentino e il blu Versace sono diventati firme cromatiche riconosciute in tutto il mondo.

Il settore alimentare italiano punta su tonalità calde e naturali. Produttori di pasta, olio d'oliva e vino scelgono il giallo grano, il verde foglia, il bordeaux e il marrone caldo per evocare genuinità e territorio. Una palette monocromatica nei toni del bordeaux o una palette analoga con verdi e gialli dorati funziona bene per questo segmento di mercato.

Il design automobilistico italiano ha creato colori iconici. Il rosso corsa Ferrari, il verde racing Alfa Romeo e il giallo Lamborghini sono riconoscibili a prima vista. Questi esempi mostrano che un singolo colore applicato con coerenza diventa un potente strumento di identità visiva. Il generatore di palette aiuta a esplorare varianti tonali e complementari a partire da un colore iconico scelto come base.

Dove usare le palette generate?

identità visiva del brand
Seleziona colori complementari per un logo esistente o costruisci una palette di branding da zero, per biglietti da visita, cancelleria e materiali di marketing.
Siti web
Definisci il colore principale, il colore accento e i toni di sfondo. I codici HEX copiati si incollano direttamente nei fogli di stile CSS o nella configurazione dei temi.
Interfacce di applicazioni
La palette tonale fornisce varianti di luminosità di un colore: più chiare per gli sfondi, più scure per il testo, intermedie per i bordi e gli stati interattivi.
Visual per i social media
Colori coerenti per le pubblicazioni, le storie e le copertine del profilo. Le palette analoghe o pastello funzionano bene per uno stile uniforme e riconoscibile.
Presentazioni e documenti
Insiemi di colori armoniosi per diapositive, grafici e infografiche. Le palette monocromatiche o minimaliste mantengono l'ordine visivo.

Risoluzione dei problemi del generatore di palette

Le palette non cambiano dopo l'inserimento di un colore
Digitare semplicemente un codice HEX non genera automaticamente le palette: devi confermare la modifica con il pulsante Aggiorna colore. Solo dopo la conferma lo strumento ricalcola i 17 schemi.
Messaggio di formato non valido
Il generatore accetta solo il formato HEX con # all'inizio, ad es. #FF5500. I formati senza # (ad es. FF5500) o in notazione RGB (ad es. rgb(255,85,0)) non sono supportati.
Formato HEX corto e completo
Entrambi i formati sono supportati: completo #RRGGBB (ad es. #FF5500) e corto #RGB (ad es. #F50). Il generatore riconosce automaticamente entrambi e li elabora in modo identico.

Domande frequenti sul generatore di palette

Quante palette genera lo strumento?

Lo strumento genera 17 palette diverse da un singolo colore base: monocromatica, analoga, complementare, triadica, complementare divisa, tetradica (quadrata), calda, fredda, terre, neon, vintage, alto contrasto, tramonto, pastello, scura, tonale e minimalista.

Cos'e una palette monocromatica?

Una palette monocromatica e composta da variazioni di una singola tonalità: tutti i colori condividono la stessa tonalità (H nel modello HSL) e variano solo in luminosità e saturazione. Queste palette sono armoniose e particolarmente adatte ai design professionali.

Cos'e una palette complementare?

Una palette complementare combina il colore base con il suo complementare: il colore opposto nel cerchio cromatico (spostamento di 180 gradi). Questo contrasto e uno dei principi fondamentali della teoria dei colori e produce un effetto vivace e dinamico.

Posso copiare i colori generati?

Sì. Clicca su un colore nella palette per copiare il suo codice HEX negli appunti. Usalo direttamente in CSS, Figma, Adobe o altri strumenti di design.

Cos'e lo spazio colore HSL?

HSL sta per Hue (tonalità), Saturation (saturazione) e Lightness (luminosità). A differenza di RGB, HSL descrive i colori come li percepiamo: la tonalità determina il colore base, la saturazione l'intensita, e la luminosità indica se il colore è chiaro o scuro. Tutte le palette di questo strumento si basano su calcoli HSL.

Qual è la differenza tra triadica e complementare divisa?

Una palette triadica utilizza tre colori equidistanti nel cerchio cromatico (120 gradi di distanza). Una palette complementare divisa utilizza, al posto del complementare diretto, i due vicini del complementare, producendo un contrasto più sottile.

Quale tipo di palette è migliore per un sito aziendale?

Le palette monocromatiche o tonali funzionano bene per siti aziendali perché offrono una gerarchia visiva unificata e serena. Usa la palette tonale per costruire un sistema completo di sfondi, testi, bordi e accenti da un unico colore del brand.

Come costruire una palette per la modalità scura?

Inizia con la palette tonale del colore del tuo brand. Usa le tonalità più scure come sfondi e le più chiare come testo. Verifica ogni combinazione testo-sfondo con un verificatore di contrasto per garantire la conformità WCAG AA (4,5:1 per testo normale).

Generatore di palette di colori – Arteon

Aiutaci a migliorare i nostri strumenti

Hai un'idea per una nuova funzionalità, hai trovato un bug o vuoi suggerire un altro strumento che renderebbe il tuo lavoro più facile? Scrivici – rispondiamo entro 24 ore.