Fix low colour contrast
Low colour contrast means text is too pale against its background for many people to read.
Prices, errors and body text disappear for people with low vision and in bright light.
Steps
- Measure the text colour against the immediate background.
- Aim for at least 4.5:1 for normal text and 3:1 for large text.
- Check text on photos, not only text on flat colour.
Failing example
A price in light grey on a white card.
Better example
The price is near-black on white.
Shopify
In the Shopify theme editor open Colors and darken text, sale prices and button labels. Check the announcement bar, which often uses a pale colour on a photo.
WooCommerce
In Appearance, Customize, darken the WooCommerce price and the sale badge text. Pale badges are a common failure on product loops.
WordPress
Change the paragraph colour in the block or the theme.json palette. Do not use the lightest grey for any sentence under 18 point.
Wix
Select the text in the Wix Editor and choose a darker swatch. If the words sit on a photo, add a solid strip behind them.