Ruota la tonalità e regola la luminosità nello spazio OKLCH perceptualmente uniforme — le stesse regole di armonia, ma le palette hanno un aspetto migliore rispetto a HSL. Ogni campione derivato può essere regolato indipendentemente, con contrasto WCAG in tempo reale.
:root {
--harmony-1: #2b9d8f;
--harmony-2: #957abc;
--harmony-3: #b47b44;
}[
{
"hex": "#2b9d8f",
"oklch": "oklch(63.0% 0.101 183.0)",
"role": "base"
},
{
"hex": "#957abc",
"oklch": "oklch(63.0% 0.101 303.0)",
"role": "harmony-2"
},
{
"hex": "#b47b44",
"oklch": "oklch(63.0% 0.101 63.0)",
"role": "harmony-3"
}
]Armonie percettivamente uniformi con contrasto live e mappatura del gamut in ogni passaggio.
Inserisci o genera casualmente un HEX, poi scegli tra complementare, split-complementare, triadico, tetradico, analogo o monocromatico.
Ogni campione derivato ha cursori L/C/H nello spazio OKLCH; i valori fuori gamut sono mappati al colore visualizzabile più vicino.
Controlla il contrasto live con bianco/nero, copia variabili CSS o JSON, o invia l'intera serie alla tavolozza.
Tre domande comuni sulle armonie OKLCH.
Continua da qui e metti i colori al lavoro.
Trascina la ruota per selezionare una base, ottieni sei schemi di armonia in tempo reale, apri nella tavola o esporta PNG.
Regola L / C / H nello spazio OKLCH perceptualmente uniforme con anteprima live e output oklch() / HEX / RGB.
Inserisci un colore marchio, ottieni primario / secondario / successo / avvertimento / pericolo — esportato come configurazione Tailwind e variabili CSS.
Barra spaziatrice per randomizzare, bloccare, trascinare per riordinare, condividere tramite URL — tutto ciò che una tavola di palette dovrebbe fare.