Black Belt ~15 min
Accessibility Kata
Ensure WCAG-compliant interactions
Why This Kata
Accessibility isn't one fix – it's three independent checks that all have to pass. Color contrast, touch target size, and interaction distance are unrelated failure modes, which is why this Kata treats them as separate, non-negotiable steps.
AccessibilityDesigning digital products that people with disabilities can perceive, understand, navigate, and interact with – which makes them better for everyone.
Fitts's LawA model stating that the time to reach a target depends on its distance and size – bigger, closer targets are faster and easier to hit.
0 / 3 steps complete
0/28 interactions
30s active time left
Sample Text
The quick brown fox jumps over the lazy dog.
Small body text at 14px
14.68:1
Contrast ratio – AAA
Contrast ratio: 14.68 to 1, WCAG AAA.#1f2937
#ffffff
AA Normal text
4.5:1 minimum
AA Large text
3:1 minimum
AAA Normal text
7:1 minimum
AAA Large text
4.5:1 minimum