Skip to main content
chambe.dev

Convertitore Colore e Verificatore Contrasto

Strumento convertitore colore gratuito. Converti tra formati HEX, RGB, HSL. Verifica rapporti di contrasto WCAG e genera palette di colore.

Verificatore Contrasto

Testo di Esempio
7.25:1
Rapporto Contrasto
✓
WCAG AA
✓
WCAG AAA

Palette Colore

Converti colori tra diversi formati istantaneamente. Che tu abbia bisogno di HEX per CSS, RGB per strumenti di design, o HSL per manipolazione colore, questo strumento gestisce tutte le conversioni.

Verifica rapporti di contrasto colore per conformità accessibilità WCAG e genera palette di colore armoniose basate sul tuo colore selezionato.

Come Usare Questo Strumento

  1. 1 t
  2. 2 o
  3. 3 o
  4. 4 l
  5. 5 s
  6. 6 .
  7. 7 c
  8. 8 o
  9. 9 l
  10. 10 o
  11. 11 r
  12. 12 .
  13. 13 h
  14. 14 o
  15. 15 w
  16. 16 T
  17. 17 o
  18. 18 U
  19. 19 s
  20. 20 e
  21. 21 .
  22. 22 s
  23. 23 t
  24. 24 e
  25. 25 p
  26. 26 s

Casi d'Uso

Web Design

Converti colori tra formati per CSS, Sass e strumenti di design.

Accessibilità

Assicura che i colori di testo e sfondo soddisfino i requisiti di contrasto WCAG.

Branding

Crea palette di colore coerenti con variazioni di tonalità appropriate.

Sviluppo

Converti rapidamente formati colore quando lavori su diverse piattaforme.

Domande Frequenti

Qual è la differenza tra HEX, RGB e HSL?

HEX usa notazione esadecimale (#RRGGBB), RGB specifica valori di rosso, verde, blu (0-255), e HSL usa tonalità (0-360), saturazione e luminosità in percentuali. Sono modi diversi di rappresentare gli stessi colori.

Cos'è il rapporto di contrasto WCAG?

WCAG (Linee Guida per l'Accessibilità dei Contenuti Web) definisce rapporti di contrasto minimi per la leggibilità del testo. AA richiede 4.5:1 per testo normale, AAA richiede 7:1. Rapporti più alti sono più accessibili.

Perché usare HSL invece di RGB?

HSL è più intuitivo per regolare i colori. Puoi facilmente creare variazioni più chiare/scure cambiando la luminosità, o versioni più/meno saturate, mantenendo la stessa tonalità.

Come creo una palette colore?

Inizia con un colore base e varia la luminosità per creare tonalità. La palette sotto mostra 10 variazioni da chiaro (50) a scuro (900), simile alle scale colore di Tailwind CSS.

Quale rapporto di contrasto dovrei cercare?

Per il testo del corpo, cerca almeno 4.5:1 (AA). Per testo grande (18px+ o 14px+ grassetto), 3:1 è accettabile. Per migliore accessibilità, cerca 7:1 (AAA) quando possibile.