Vložte celou svou paletu do auditní tabulky N×N – poměry WCAG a hodnoty APCA Lc pro každý pár popředí × pozadí, vše na první pohled.
| fg ↓ / bg → | |||||||
|---|---|---|---|---|---|---|---|
Ag1.0Lc0 | Ag4.2Lc+35 | Ag3.8Lc+31 | Ag5.2Lc+42 | Ag8.4Lc+62 | Ag1.2Lc0 | Ag17.4Lc+104 | |
Ag4.2Lc-33 | Ag1.0Lc0 | Ag1.1Lc0 | Ag1.3Lc0 | Ag2.0Lc+25 | Ag5.0Lc-34 | Ag4.2Lc+67 | |
Ag3.8Lc-29 | Ag1.1Lc0 | Ag1.0Lc0 | Ag1.4Lc+10 | Ag2.2Lc+30 | Ag4.6Lc-30 | Ag4.6Lc+72 | |
Ag5.2Lc-40 | Ag1.3Lc0 | Ag1.4Lc-11 | Ag1.0Lc0 | Ag1.6Lc+18 | Ag6.3Lc-41 | Ag3.3Lc+60 | |
Ag8.4Lc-61 | Ag2.0Lc-27 | Ag2.2Lc-32 | Ag1.6Lc-20 | Ag1.0Lc0 | Ag10.2Lc-62 | Ag2.1Lc+40 |
Řádky = barva textu (popředí), sloupce = pozadí. Každá buňka zobrazuje skutečný pár popředí na pozadí se dvěma metrikami přístupnosti: poměr WCAG (AA text ≥ 4,5, AA velký text ≥ 3,0) a APCA Lc (75+ pro text, 60+ pro velký text).
Všechny kandidátní barvy v jedné matici N×N – přístupnost pro každý pár popředí × pozadí najednou.
Přidejte firemní barvy, sémantické barvy a neutrální barvy (až 10). Řádky jsou popředí, sloupce jsou pozadí.
Každá buňka zobrazuje poměr WCAG a APCA Lc. Tečky se rozsvítí: pro text těla je potřeba Lc 75+, pro velký text 60+.
Zaznamenejte páry tlačítek a páry textu těla do vaší specifikace designu; odstraňte nevyhovující kombinace před jejich zveřejněním.
Tři časté otázky z auditů celé matice.
Zařaďte vyhovující páry do své sémantické palety a specifikace.
Ověření kontrastu podle WCAG 2.1 mezi libovolnou barvou popředí a pozadí.
Simulujte 8 typů poruch barevného vidění pro audit přístupnosti.
De facto standardy akademického publikování — Okabe-Ito (doporučené časopisem Nature Methods), série Paula Tola, paleta časopisu Nature NPG a vnímáníově jednotná viridis. Každý vzorek má známku kontrastu APCA a níže je 8 typů simulátoru barevného vidění, které ověřují každou paletu v reálném čase.
Zadejte jednu značkovou barvu a získejte primární / sekundární / úspěch / varování / nebezpečí – export jako konfigurace Tailwind a CSS proměnné.