How to fix color contrast on Wix

Increase the contrast ratio between your text color and its background color to at least 4.5:1 so all users — including those with low vision — can read your content.

Steps for Wix

  1. Open the Wix Editor, click on the element with the failing text color.
  2. In the design panel (paintbrush icon) click Text color or Link color and choose or enter a hex value with sufficient contrast. Use Wix's built-in color picker; note the hex as you adjust and verify it in an external contrast checker.
  3. For site-wide link colors, go to Site Design (the site icon in the left panel) → Colors & Fonts and update the relevant palette color to a passing shade — this will cascade to all elements using that palette slot.
  4. Save and publish, then re-audit with Chrome Lighthouse.
Official Wix documentation ↗
/* BEFORE — fails WCAG 4.5:1 on white background */
a, .link-color {
  color: #007fbf; /* contrast ratio ~4.38:1 on #ffffff */
}

/* AFTER — passes WCAG 4.5:1 on white background */
a, .link-color {
  color: #006699; /* contrast ratio ~5.06:1 on #ffffff ✓ */
}

/* Tip: use a CSS custom property so one change fixes every instance */
:root {
  --color-link: #006699;
}
a, .link-color {
  color: var(--color-link);
}

What is color contrast?

Color contrast is the difference in brightness between the color of your text and the color of the background behind it. Web accessibility guidelines (WCAG 2.1 Success Criterion 1.4.3) require that normal-sized text achieve a contrast ratio of at least 4.5:1, and large text (18pt/24px or 14pt/18.67px bold) at least 3:1. A ratio of 4.38:1 — like a medium blue (#007fbf) on white (#ffffff) — falls just short of the normal-text threshold. The fix is simply choosing a slightly darker (or lighter) version of the color so the ratio clears 4.5:1.

Roughly 1 in 12 men and 1 in 200 women have some form of color vision deficiency, and millions more have low vision or read in poor lighting conditions. Text that fails the contrast threshold is genuinely hard to read for these shoppers, directly reducing conversions and increasing bounce rates. Legally, WCAG 2.1 Level AA is the standard referenced in ADA, Section 508 (US), EN 301 549 (EU), and equivalent laws worldwide — failing it exposes your store to demand letters, complaints, and lawsuits. Search engines also reward accessible, readable pages, so fixing contrast can have a small positive effect on rankings.

See the complete Color contrast guide for every platform and the full background.

Not sure if your Wix store has this?

Run a free SEOLZ audit — we’ll find color contrast and every other issue across your whole site.

Scan my site free

Fix color contrast on another platform