Convalida del contrasto WCAG 2.1 tra qualsiasi colore di primo piano e sfondo.
Esempio di titolo grande
Esempio di testo del corpo. Il volpe bruno veloce salta sopra il cane pigro.
APCA modella la percezione umana: rispetta la polarità, la dimensione e il peso del testo, quindi prevede la leggibilità nel mondo reale meglio del rapporto WCAG 2.1. Lc 75+ per il testo del corpo, 60+ per il testo grande.
APCA tiene conto della polarità: chiaro su scuro e scuro su chiaro hanno punteggi diversi, quindi scambiare primo piano/sfondo produce un Lc diverso — per progettazione, non per errore.
APCA va oltre superare/non superare — questa tabella mostra la dimensione minima del font leggibile per ogni peso a questo contrasto, direttamente dalla ricerca ufficiale dei font APCA.
Dimensioni maggiori sono più leggibili; 777 indica che quel peso non è consentito a questo contrasto. I pesi molto spessi (900) possono richiedere dimensioni maggiori per le piccole dimensioni.
Contrasto WCAG 2.1 tra due colori, con valutazioni live AA/AAA su quattro livelli.
Incolla un HEX per il primo piano e lo sfondo; il testo di esempio si ri-renderizza istantaneamente.
Testo normale (4,5:1) e testo grande (3:1) sono valutati separatamente, con il rapporto aggiornato in tempo reale.
Non superi il test? Regola la luminosità fino a quando non lo superi; per pulsanti e titoli basta il livello AA.
Quattro domande che sorgono quando si applica l'accessibilità nella pratica.
Continua da qui e metti i colori al lavoro.
Trasforma qualsiasi colore in una scala di sistema di design a 11 gradini, percettivamente uniforme in OKLCH, con contrasto WCAG per ogni gradino, esportazione in Tailwind/CSS/SCSS/JSON.
Inserisci un codice RAL, Pantone o NCS — o qualsiasi HEX — e confrontalo tra tutti i 10 sistemi standard con ΔE CIEDE2000.
Simula 8 tipi di deficit della visione dei colori per verificare l'accessibilità.
Barra spaziatrice per randomizzare, bloccare, trascinare per riordinare, condividere tramite URL — tutto ciò che una tavola di palette dovrebbe fare.