Nouplo

Generatore di palette di colori

Premi la barra spaziatrice per una nuova palette; blocca i colori che ti piacciono.

o premi la barra spaziatrice
  1. rgb(237, 221, 187)hsl(41, 58%, 83%)
    Testo bianco
    1.34:1AAAAA
    Testo nero
    15.66:1AAAAA
  2. rgb(143, 173, 255)hsl(224, 100%, 78%)
    Testo bianco
    2.19:1AAAAA
    Testo nero
    9.59:1AAAAA
  3. rgb(92, 123, 230)hsl(227, 73%, 63%)
    Testo bianco
    3.87:1AAAAA
    Testo nero
    5.43:1AAAAA
  4. rgb(59, 91, 219)hsl(228, 69%, 55%)
    Testo bianco
    5.67:1AAAAA
    Testo nero
    3.71:1AAAAA
  5. rgb(60, 52, 31)hsl(43, 32%, 18%)
    Testo bianco
    12.33:1AAAAA
    Testo nero
    1.70:1AAAAA

Nulla lascia il tuo dispositivo

Questo strumento funziona interamente nel browser. Quello che scrivi, suoni o registri qui resta sul tuo dispositivo: nulla viene caricato o salvato su un server.

Come funziona

  1. Premi Genera o la barra spaziatrice per una nuova palette, oppure scrivi un colore base e scegli uno schema come complementari o triade.
  2. Blocca i colori che ti piacciono: la palette successiva li tiene e costruisce gli altri intorno. Clicca un colore per copiarne il codice hex.
  3. Controlla i badge di contrasto, guarda come la vede chi è daltonico, poi copia le variabili CSS o scarica PNG o SVG.

Domande frequenti

Quali sono gli schemi di colori?
Regole del cerchio cromatico: analoghi usa i vicini (±30°), complementari la tinta opposta, complementari divisi le due accanto all’opposta, triade tre tinte a 120°, quadrato quattro a 90°, monocromatico una sola tinta in gradazioni di chiaro e scuro, pastello colori tenui e chiari su tutto il cerchio.
Perché i colori sembrano equilibrati?
Sono calcolati in OKLCH, uno spazio colore che segue la luminosità percepita dall’occhio, così i passaggi di chiaro e scuro appaiono regolari; i colori che uno schermo non può mostrare vengono attenuati finché non rientrano.
Che cosa indicano i badge di contrasto?
Il rapporto di contrasto WCAG del testo bianco e nero su ogni colore: AA richiede 4,5 per il testo normale, AAA 7. La scritta sul colore usa quello dei due che si legge meglio.
Posso ricavare una palette da una foto?
Sì: lo strumento Palette di colori da un’immagine estrae i colori principali di una foto. Questo invece crea combinazioni nuove.
Viene caricato qualcosa?
No. Le palette nascono nel tuo browser; il link di condivisione contiene solo i colori.

Strumenti correlati

◉ Palette di colori da un’immagine I colori principali dell’immagine, in codici hex. ◒ Strumenti per sviluppatori Convertitore di colore HEX, RGB, HSL e CMYK — più il rapporto di contrasto che decide la leggibilità. ◒ Strumenti per sviluppatori Generatore di gradienti CSS Colori da una parte, una dichiarazione dall’altra. ◐ Strumenti per sviluppatori Verifica del contrasto Se qualcuno riesce davvero a leggerlo.