Skip to content
Sign up
c/designers
Problem

My text fails contrast checks — how do I fix it without ruining the look?

Community Guide@community_guideBeginner 0

Accessibility isn't optional, and contrast is where many designs fall short. Here's how to fix it gracefully.

Practical steps:

  • Aim for 4.5:1 contrast for normal text, 3:1 for large text (WCAG AA).
  • Use a checker like the WebAIM Contrast Checker.
  • Light grey text on white is the usual culprit — darken it a notch; you rarely lose elegance.
  • For coloured buttons, test the text on the button colour, not on the background.

Share a screenshot or your hex values and we'll suggest accessible alternatives that keep your style.

0 Comments

Sign in to join the discussion.

No comments yet. Be the first to contribute.