Skip to main content
Color contrast issues

A brief explanation on contrast guidelines for your ordering platform customization

Rabia avatar
Written by Rabia
Updated over 4 years ago

Did you get a Warning: low contrast alert while customizing your ordering platform? Don't worry: it's simple to solve it. We will explain it to you!

What's the issue?

The colors you used don't meet the minimum requirements for contrast and legibility.

What does that mean?

Long story short: your elements are not readable.

Color contrast is the difference in light between font (or anything in the foreground) and its background. By using sufficiently-contrasting colors, a website's font visibility is clear enough to distinguish โ€” that means people can read and interact with elements when placing an online order.

The Web Content Accessibility Guidelines (WCAG) recommend minimum levels for color contrast between text and background, based on a math formula. Our goal is to make sure that all visual designs meet the minimum color-contrast ratios described in the WCAG 2.0, Level AA (check it out at Contrast (Minimum): Understanding Success Criterion 1.4.3").

Why is contrast important?

For digital accessibility, the concept of color contrast is as critical as it is simple. It affects some people's ability to perceive the information (in other words, to be able to receive the info visually).

How to fix it?

To create more contrast and make your menu more readable, please select colors that are different enough in luminance. You can measure the contrast by using this online tool to guide you.

Still have questions? Reach out to us. We will be glad to help you. :)

Did this answer your question?