Colors

Color Contrast and Accessibility

Sufficient color contrast is essential for the readability and accessibility of your store. Text, controls, and input fields, in particular, must stand out clearly from the background so that people with visual impairments can easily recognize and use them.

Here's what you should pay attention to:

• Text and background: The contrast should be at least 4.5:1 (for body text) or 3:1 (for larger fonts and UI elements).

• Input fields and buttons: They should stand out clearly from the background and be easily recognizable – ideally with a visible border or a distinct fill color.

• Focus and hover effects: Ensure that interactive elements such as buttons or form entries are clearly highlighted when focused or hovered.

Tip: You can test the color contrast with online tools such as the WebAIM Contrast Checker or browser plugins for accessibility testing and adjust it if necessary. This ensures that your store is easily accessible for all users.