Verifica del contrasto dei colori
Verifica il contrasto WCAG 2.1 e APCA di due colori — oppure trascina uno screenshot e vedi esattamente dove i tratti sottili rendono il testo difficile da leggere. Tutto in locale, senza caricamenti.
How to capture solid material
Browser zoom does not increase resolution, and snipping tools on HiDPI displays often capture logical instead of physical pixels. Use Chrome DevTools → Elements panel → right-click the element → "Capture node screenshot", or Firefox's right-click screenshot — both capture at device resolution.
| # | Occurrences | Stroke width | WCAG nominal → effective | APCA nominal → effective |
|---|
Note — the analysis runs entirely locally in your browser; the screenshot never leaves your device. Clicking a table row steps the loupe through that group's occurrences.
Perché un rapporto conforme può restare difficile da leggere
Tutti gli strumenti di verifica del contrasto prendono due valori di colore e restituiscono un rapporto. Quel numero è onesto sui colori — e cieco a tutto il resto. Una coppia a 4,5:1 che supera WCAG AA può essere davvero difficile da leggere quando il carattere è sottile e piccolo: all’occhio non arriva il colore nominale del testo, ma la miscela di anti-aliasing tra testo e sfondo effettivamente disegnata sullo schermo. Più il tratto è sottile, più ogni lettera è fatta di quei pixel di bordo sbiaditi — e il contrasto effettivo scende sotto ciò che i due valori esadecimali promettevano. È questo divario che lo strumento colma: accanto alla classica verifica a due colori, analizza uno screenshot della tua interfaccia reale e misura dove i tratti sono più sottili e quale contrasto effettivo c’è esattamente in quei punti.
Lo strumento mostra sempre entrambi i riferimenti: il rapporto WCAG 2.1, lo standard di conformità attuale (4,5:1 per il testo normale, 3:1 per il testo grande), e l’Lc di APCA, il modello percettivo candidato per WCAG 3, che tiene conto della polarità chiaro/scuro. In pratica, Lc 90 è ideale per il testo di lettura, Lc 75 è l’obiettivo per il testo normale, Lc 60 basta per testo grande o in grassetto, e sotto Lc 45 non dovrebbe esserci alcun testo. Quando i due valori si contraddicono, segui il più pessimista.
Un contrasto effettivo basso non è un caso limite: la sensibilità al contrasto diminuisce con l’età e crolla con cataratta, degenerazione maculare o astigmatismo; la luce diretta del sole e gli schermi poco luminosi peggiorano le cose, come il testo tutto in maiuscolo. Le correzioni derivano direttamente dalle misure: tratti sotto i 2 px → aumentare il peso del carattere (400 → 500/600); contrasto insufficiente → scurire il colore del testo; testo troppo piccolo → prima ingrandirlo. Per valori affidabili usa uno screenshot a risoluzione 2× (Retina). L’analisi gira interamente nel tuo browser — lo screenshot non lascia mai il tuo dispositivo.
Privacy by design
Tutta l’elaborazione avviene nel tuo browser. I tuoi file non raggiungono mai un server — non c’è nulla da memorizzare, trasmettere o condividere.
Scopri di più nella nostra informativa sulla privacyDomande frequenti
È gratuita, senza registrazione, e non viene caricato nulla. Sia la verifica dei colori sia l’analisi completa dello screenshot girano nel tuo browser — puoi disconnetterti da internet dopo il caricamento della pagina e tutto continua a funzionare.
Come regola generale, Lc 90 è ideale per il testo di lettura, Lc 75 è l’obiettivo per il testo normale, Lc 60 è accettabile per testo grande o in grassetto, e sotto 45 non dovrebbe esserci alcun testo. APCA tiene conto della polarità — chiaro su scuro e scuro su chiaro ottengono punteggi diversi, a differenza del rapporto WCAG.
Perché il rapporto descrive solo i due colori nominali. Con pesi sottili, l’anti-aliasing mescola gran parte di ogni tratto con lo sfondo: il contrasto realmente visualizzato è più basso. L’analisi misura quei pixel reali nei punti più sottili — è il valore che i tuoi lettori percepiscono.