Verifica contrasto colore

Testa il rapporto di contrasto tra colori di primo piano e di sfondo per garantire l'accessibilità.

1.00:1
Contrasto
Fail
Molto scarso

Testo normale

AA (4.5:1)
AAA (7:1)

Testo grande

AA (3:1)
AAA (4.5:1)
White
#ffffff
Fringy Flower
#b1e2c1

Correzioni rapide

Aa

Titolo di anteprima

La veloce volpe marrone salta sopra il cane pigro

Esempio di testo piccolo (12px)

Testo
#ffffff
Sfondo
#b1e2c1

Standard WCAG

Level AA

Rapporto di contrasto minimo di 4.5:1 per il testo normale e 3:1 per il testo grande. Richiesto per la maggior parte dei siti web.

Level AAA

Rapporto di contrasto migliorato di 7:1 per il testo normale e 4.5:1 per il testo grande. Raccomandato per un'accessibilità ottimale.

Contrasto insufficiente per tutte le dimensioni del testo - non rispetta gli standard WCAG.

Controllo contrasto colore

Calcola il rapporto di contrasto tra testo e colori di sfondo.

Scegli un colore usando il color picker per il testo e il colore di sfondo o inserisci un colore nel formato esadecimale RGB (es. #259 o #2596BE). Puoi regolare il cursore per selezionare il colore. Le Linee Guida per l'Accessibilità dei Contenuti Web (WCAG) hanno una linea guida specifica per determinare se il testo è leggibile per gli utenti vedenti. Questo criterio utilizza un algoritmo particolare per mappare le combinazioni di colori in rapporti comparabili. Usando questa formula, le WCAG affermano che un rapporto di contrasto di 4.5:1 tra testo e sfondo è adeguato per il testo normale (corpo), e il testo grande (18+ pt normale, o 14+ pt grassetto) dovrebbe avere almeno un rapporto di contrasto di 3:1.

Caratteristiche principali

  • Calcolo del rapporto di contrasto in tempo reale
  • Verifica della conformità WCAG AA & AAA
  • Slider HSL per regolazioni fini
  • Formati di anteprima multipli

Strumenti avanzati

  • Correzione automatica dei colori
  • Campioni di testo e sfondo
  • Rilevamento del nome del colore
  • Esporta risultati