Overview
Vesper Colors is a free color contrast checker available on iOS and the web. It lets you check any foreground and background color pair against WCAG 2.2 AA and AAA contrast standards instantly - no account required, no limits, no paywall.
What Vesper Colors does
Enter two colors - a foreground and a background - and Vesper Colors:
- Calculates the exact contrast ratio between them
- Shows a pass or fail result for each of the four WCAG 2.2 checks: AA Normal, AAA Normal, AA Large, and AAA Large
- Renders a live text preview so you can see how the colors look together
- Lets you preview the pair across five color blindness vision types
- Shows the pair applied to real UI components: navigation bars, hero sections, forms, footers, data tables, and charts
- Generates a shareable link to the exact pair
Where to find it
Vesper Colors is available in two places:
- iOS app - download Vesper Colors from the App Store. The app includes a Check tab, a Preview tab, and an About tab.
- Web tool - use it directly at vesperapps.com/colors. No installation needed.
Both versions share the same features and stay in sync via shareable links - send a pair from the app and it opens in the web tool with the same colors pre-loaded, and vice versa.
The two main views
Check
The Check view is where you enter and evaluate color pairs. It shows the contrast ratio, the four WCAG badges, a text preview, a share button, and a set of ten starter pairings to explore.
Preview
The Preview view shows your current pair applied to real UI component mockups. Swap between Normal, Protanopia, Deuteranopia, Tritanopia, and Achromatopsia vision simulations to see how the pair holds up for users with different color vision. You can also toggle light and dark backgrounds, and swap foreground and background colors.
Getting started
- Open Vesper Colors on iOS or at vesperapps.com/colors.
- Tap or click either the foreground or background swatch to open the color picker.
- Enter a hex value or drag the picker to select a color.
- Read the contrast ratio and WCAG results instantly.
Or tap any of the ten starter pairings at the bottom of the Check view to load a pre-built color pair and start exploring from there.