Selettore colori (HEX, RGB, HSL, OKLCH)
Scegli un colore sul quadrato saturazione–luminosità o inserisci HEX, RGB, HSL o OKLCH. Tutti i formati restano sincronizzati, con scala tinte/ombre, contagocce (Chromium) e palette esportabili in CSS e JSON.
Come scegliere ed esportare i colori
1. Trascina sul quadrato e sul cursore della tinta, oppure incolla HEX/RGB/HSL/OKLCH.
2. Leggi HEX, RGB, HSL e OKLCH sincronizzati nella barra.
3. Clicca un’ombra o un campione di armonia per esplorare colori correlati.
4. Copia un valore, un link ?hex= oppure esporta variabili CSS / JSON.
Esempi di selettore colori
Terracotta di brand #8F665E
Il picker HSV mantiene la tinta mentre scurisci per l’hover. Esporta --color e --shade-* come variabili CSS.
Palette analoga per dashboard
Scegli Analoghi per tinte ±30° e ±60°. Copia la striscia come custom properties per card e grafici.
OKLCH per passi uniformi
La rampa varia la chiarezza OKLCH, più uniforme che mescolare HEX con il bianco. Usa oklch() nel CSS moderno.
Quando usare questo strumento
• Quando scegli colori UI e ti servono HEX, RGB, HSL e OKLCH insieme.
• Quando generi stati hover/muted da una tinta di brand.
• Quando esporti una piccola palette (armonia + rampa) in variabili CSS.
Armonie per palette UI
I complementari stanno a 180° — contrasto forte, da usare con parsimonia sui CTA. Gli analoghi (±30–60°) unificano una dashboard. Triadi e tetradi danno più varietà; abbassa la saturazione degli extra perché il primary resti dominante. Verifica il testo con il checker di contrasto WCAG.
Domande frequenti
HEX vs RGB vs HSL vs OKLCH?
HEX e RGB sono lo stesso colore sRGB. HSL serve per tinta e chiarezza. OKLCH è percettivo: passi L simili appaiono più uniformi e oklch() è CSS moderno valido.
Il contagocce funziona in ogni browser?
L’API EyeDropper è in Chromium (Chrome, Edge). Altrimenti digita un valore o usa il selettore visivo.
Posso condividere un colore?
Sì. L’URL si aggiorna con ?hex=RRGGBB. Copia il link per riaprire lo stesso colore.
I colori passano da un server?
No. Conversione, armonie ed export girano in locale nel browser.