Checker contrasto colore

The quick brown fox jumps over the lazy dog.Large text and UI components use the lower 3:1 AA threshold.

Viene eseguito interamente nel browser: nulla di ciò che incolli viene caricato o memorizzato. I conteggi anonimi degli esiti per singola esecuzione possono essere utilizzati per ricerche aggregate; URL, domini, IP e identificatori non sono mai inclusi e nessuna statistica viene pubblicata sotto le 100 esecuzioni.

Commenti
Segnala un errore

Qualcosa non funziona in Checker contrasto colore? Descrivi cosa è successo: la segnalazione va direttamente a una coda di valutazione privata, non a un elenco pubblico.

Dati che verranno inviati
 Input dello strumento, caricamenti, fonti incollate, risultati completi, parametri di query e frammenti URL non vengono allegati automaticamente. Puoi modificare o rimuovere il passaggio selezionato sopra. I metadati del browser e anti-abuso vengono elaborati per prevenire lo spam. 

Palette audit

Paste CSS variables, token declarations, or a hex list. The matrix checks every color as text against every other color as a background.

Informazioni sullo strumento

Controlla il contrasto WCAG 2.2 AA e AAA per qualsiasi coppia foreground/background, trova i colori passanti più vicini e analizza palette CSS o design token nel browser.

Funzionalità

  • Rapporti di contrasto AA e AAA per testo normale e grande.
  • Ricerca del colore passante più vicino.
  • Audit locale di CSS e palette di design token.
  • Controlli per URL e campioni incollati senza registrazione.

Come funziona

Inserisci i colori o un campione CSS, poi esegui il controllo. Il checker calcola luminanza e rapporto, confronta le soglie WCAG e suggerisce correzioni vicine.

Limitazioni

  • Un rapporto di contrasto non dimostra da solo che una pagina sia accessibile.
  • Il rendering reale, focus, struttura e contenuto richiedono verifiche separate.

Domande frequenti

Quale rapporto di contrasto serve?

Le linee guida di livello intermedio richiedono 4,5:1 per il testo normale e 3:1 per testo grande e componenti grafici. Il livello massimo richiede 7:1 per testo normale e 4,5:1 per testo grande.

Dimostra che la pagina è accessibile?

No. Controlla coppie di colori, non tipografia, stato attivo, immagini di testo o, in modalità incolla, sfondi realmente renderizzati. Usalo durante la progettazione e prova anche l’interfaccia finita.

Dove va la mia tavolozza?

In modalità incolla resta sul dispositivo. Puoi inserire proprietà CSS, elementi nome/valore o un elenco di colori esadecimali. Solo la modalità URL invia al server l’indirizzo pubblico inserito, non la tavolozza.

In che cosa differisce la modalità URL dall’incollare colori?

I colori incollati danno il calcolo esatto della coppia. La modalità URL carica la pagina reale in un navigatore automatico e legge colore e sfondo calcolati dopo cascata CSS, ereditarietà, opacità e impostazioni predefinite, producendo un verdetto più fedele.