Real-Time Contrast Checker
Instructions
- Set colors: Input your foreground and background color codes or use the color picker square.
- Check results: See if the contrast meets your project’s criteria in the results section.
- Adjust (if needed): If the contrast fails, fine-tune the colors using the luminance slider until it passes.
Input
Foreground Color
☀️
🌘
Move slider right to increase lightness, left to decrease lightness.
100%
Swap color
Background Color
☀️
🌘
Move slider right to increase lightness, left to decrease lightness.
30%