Contrast Checker
Contrast ratio
1.00:1
-
Normal text Body copy, under 24px
-
Large text 24px and up, or 19px bold
-
Icons and UI Borders, focus rings, graphics
Closest colors that pass AA for normal text
Text
Background
Preview
Large text is easier to read
Body text needs the most contrast, because it is small and there is a lot of it. If this paragraph feels like work to read, it will for your readers too.
Small print, captions, and labels are the first to disappear.
Outline
Solid
The link remembers both colors.
About Color Contrast Checker
Pick a text color and a background and see at once whether people will be able to read it. The ratio is measured the way the Web Content Accessibility Guidelines (WCAG 2) define it, from 1:1 (identical colors) to 21:1 (black on white).
- AA and AAA results for normal text, large text, and interface elements
- Type a hex code, an rgb() or hsl() value, or a color name like navy
- When a pair fails, get the closest text or background color that passes
- Share a link that opens with your two colors