Salta al contenuto principale

Colore #7C3AED

Blu Violetto
Genera codici colore, variazioni, armonie e verifica i rapporti di contrasto.
Spettro Colori
Tonalità
Alfa
#7C3AED
Blu Violetto
Scuro - usa testo bianco
Valori
HEX
RGB
HSL
HSV
CMYK
CSS
Cursori RGB
R
124
G
58
B
237
Selezione Rapida
Colori Recenti
Nessun colore ancora - inizia a selezionare!
Ombre Rapide
Tinte Rapide
Conversione Colore

Tutti i formati colore standard e avanzati. Clicca su qualsiasi riquadro per copiare.

Variazioni

Ombre (nero puro aggiunto) e Tinte (bianco puro aggiunto) con incrementi del 10%. Suggerimento: Usa le ombre per stati hover e ombreggiature, le tinte per evidenziazioni e sfondi.

Ombre - Variazioni più scure (aggiunto nero)
Variazioni più scure create mescolando nero puro al colore base, con incrementi del 10%.
Tinte - Variazioni più chiare (aggiunto bianco)
Variazioni più chiare create mescolando bianco puro al colore base, con incrementi del 10%.
Casi d'uso comuni • Stati dei componenti UI (hover, attivo, disabilitato)
• Creare profondità con ombreggiature e luci
• Costruire sistemi colore coerenti

Suggerimento per il design system
Queste variazioni costituiscono la base di una palette colore coesa. Usa le tinte al 10–30% come riempimenti di sfondo e le ombre al 70–90% come colori delle ombre.
Combinazioni Colore

Ogni armonia ha il suo umore. Clicca su qualsiasi campione colore per selezionarlo. Queste combinazioni sono matematicamente provate per creare armonia visiva.

Controllo Contrasto

Testa le combinazioni di colori per assicurarti che soddisfino gli standard di accessibilità WCAG per la leggibilità del testo.

Colore Testo
Colore Sfondo
Testo Grande - Intestazione Testo piccolo - Esempio di corpo. La volpe marrone salta sopra il cane pigro. Lorem ipsum dolor sit amet.
-
Rapporto di Contrasto
AA: Minimo 4.5:1 per testo normale, 3:1 per testo grande. Richiesto per la maggior parte dei siti web.
AAA: Migliorato 7:1 per testo normale, 4.5:1 per testo grande. Raccomandato per accessibilità ottimale.
Formati Tecnici

Tutti i formati pronti per sviluppatori. Clicca sul pulsante copia in qualsiasi riga.

Formati Pratici

Guarda come appare il tuo colore in componenti UI del mondo reale.

Analisi Colore

Analisi approfondita delle proprietà del tuo colore e delle caratteristiche psicologiche.

Simulatore Daltonismo

Simula come appare il tuo colore alle persone con diversi tipi di deficit della visione dei colori. Clicca su qualsiasi campione per applicare quel colore.

Aspetti Creativi

Suggerimenti di gradienti e raccomandazioni di abbinamento colore per i tuoi progetti.

Carica un'Immagine

Trascina & rilascia qualsiasi immagine, o clicca per sfogliare

PNG · JPG · GIF · WebP · SVG · BMP
👆 Clicca per selezionare un colore

Carica un'immagine, poi
clicca su qualsiasi pixel per selezionare il suo colore

#000000
HEX
RGB
HSL
Ombre & Tinte
Cronologia