Verifica del contrasto dei colori
Check WCAG AA e AAA contrasto di testo per i colori esagonali opachi. Anteprima la tua coppia, scambia colori e applica un'alternativa di testo più alta contrasto.
Rapporto di contrasto
Color contrast report
Text: #777777 Background: #ffffff Contrast ratio: 4.4781:1
- AA · normal text: Fail (requires 4.5:1)
- AA · large text: Pass (requires 3:1)
- AAA · normal text: Fail (requires 7:1)
- AAA · large text: Fail (requires 4.5:1)
Large text: at least 24 CSS px, or approximately 18.67 CSS px when bold. This checks opaque sRGB text contrast only, not overall accessibility.
Il testo esportato resta in inglese; i tuoi dati vengono mantenuti come inseriti.
Non c'e' segnale. Niente crediti per l'IA. Questo strumento assembla l'output nel tuo browser.
Da un'idea a qualcosa di utile.
- 01
Inserire i colori di testo e sfondo.
- 02
Rivedere il rapporto calcolato e le soglie normali o di testo grande.
- 03
Provare un colore di testo suggerito e esportare il risultato.
Un po' di contesto.
I rapporti di contrasto usano il WCAG formula relativa-luminance per colori sRGB opaco. AA testo normale richiede 4.5:1 e AA testo grande richiede 3:1. Il testo grande generalmente significa almeno 24 CSS pixel, o approssimativamente 18.67 CSS pixel in grassetto. Il rapporto grezzo determina il risultato prima dell'arrotondamento. Questo è un controllo del colore, non un controllo dell'accessibilità.
Buone domande.
Posso entrare in colori trasparenti?
No. Utilizzare i valori esagonali opachi a tre o sei cifre. Compositi colori trasparenti sul loro sfondo finale prima di misurare.
Un rapporto di passaggio significa che la mia pagina è accessibile?
No. Navigazione tastiera, semantica, messa a fuoco, dimensionamento leggibile, e altri requisiti ancora bisogno di test. Lo strumento valuta solo questa coppia di testo/fondo.