Color contrast — Nakshora 3.0 accessibility

AccessibilityNakshora 3.0Updated 2026-09-152 tags

WCAG requires 4.5:1 for body text, 3:1 for large text and UI boundaries. Nakshora palettes make this a pairing discipline. Practical accessibility guidance with Nakshora 3.0 utilities.

Color contrast — Nakshora 3.0 accessibility — Nakshora Docs — Accessibility · Nakshora Docs editorial library

WCAG requires 4.5:1 for body text, 3:1 for large text and UI boundaries. Nakshora palettes make this a pairing discipline.

The guidance#

Contrast is a property of PAIRS. For each palette, shades 50–400 carry dark text and 600+ carry white text. Verify critical pairs once, then encode them as component classes or tokens so the decision is never reopened.

In markup#

html

<button class="bg-blue-600 text-white px-4 py-2 rounded-lg">7.0:1 on white</button>
<button class="bg-blue-100 text-blue-800 px-4 py-2 rounded-lg">Accessible light variant</button>

Checklist#

Tested with keyboard only
Screen-reader spot check
Contrast verified for new pairs
Reduced-motion behavior confirmed
Zoomed to 200% without loss

accessibility/index|Accessibility hub · utilities/interactivity/sr-only|sr-only

#accessibility #a11y