Skip to content

a11y(website): fix color contrast failures (WCAG 2.1 AA) #399

@ajitpratap0

Description

@ajitpratap0

Problem

Nav links and other secondary text use text-zinc-400 (~#a1a1aa) on dark backgrounds, achieving ~3.5:1 contrast ratio. WCAG 2.1 AA requires 4.5:1 for normal text.

axe-core reported 19 affected nodes on the docs page alone.

Affected elements:

  • Nav links (Docs, Playground, Blog…)
  • Breadcrumb text
  • Code panel labels (query.sql, AST Output)
  • Footer links

Fix

Change secondary text elements to text-zinc-300 or lighter. Specifically update nav links, breadcrumbs, code panel labels, and footer text from text-zinc-400/text-zinc-500 to text-zinc-300 on dark backgrounds.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions