Search
Understanding Contrast Ratio
With Framer, you have complete control over the look and feel of your websites. Before launchingy your website, we recommend you to check if the contract ratio complies with the accessibility standards.
What is Contrast Ratio?
Contrast ratio refers to the difference in luminance between two colors, typically the foreground (text or graphics) and the background. It is measured on a scale from 1:1 to 21:1, with higher values indicating better contrast. A sufficient contrast ratio ensures readability and visibility, particularly for users with visual impairments, color blindness, or other conditions affecting perception.
WCAG Guidelines for Contrast Ratio
The Web Content Accessibility Guidelines (WCAG) provides specific recommendations for contrast ratios, emphasizing their importance in creating accessible digital experiences. As of the latest version (WCAG 2.1), Level AA compliance requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold).
Before launching your site to the world, we recommend you to use any of the following contrast ratio checkers: