๐๏ธ
Color Accessibility Preview
Preview and test color contrast ratios for WCAG accessibility compliance. Simulate color blindness and ensure your designs are accessible to everyone.
Contrast Ratio
10.1:1
AA
AA Large
AAA
AAA Large
WCAG 2.1 compliance levels
The quick brown fox jumps over the lazy dog
This is body text at normal size. WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text.
Small text (below 18px or 14px bold) must meet stricter requirements.
The quick brown fox jumps over the lazy dog
This preview simulates how your color combination appears to users with different types of color vision deficiency.
WCAG AA (Normal text):: โฅ 4.5:1
WCAG AA (Large text):: โฅ 3:1
WCAG AAA (Normal text):: โฅ 7:1
WCAG AAA (Large text):: โฅ 4.5:1
Related Tools
๐จ
Background Pattern Generator
CSS / Styles
15.6k
๐
Bezier Curve Visualizer
Developer Tools
13.5k
๐ฆ
CSS Box Model Visualizer
Developer Tools
13.2k
๐๏ธ
CSS Backdrop Filter Preview
Preview & Live Render
12.8k
โ๏ธ
Clip Path Generator
CSS / Styles
12.5k
๐จ๏ธ
CMYK โ RGB Converter
Color Tools
11.8k
๐ท๏ธ
Badge Generator
CSS / Styles
11.0k
๐ผ
Color Palette to ASE Swatch
Color Tools
10.0k
๐ฆ
CSS Flexbox Generator
Design Tools
10.0k
๐ง
3D Fractal Viewer
3D Tools
10.0k
๐
Analogous Color Generator
Color Tools
10.0k
๐ฌ
CSS Animation Generator
Design Tools
10.0k
๐จ
CSS Color Function Converter
Color Tools
10.0k
๐ป
Color Palette Theme for VS Code
Code Tools
10.0k
๐๏ธ
CSS Color Contrast Ratio Visualizer
Accessibility
10.0k
๐จ
ASCII Art Generator
Design Tools
10.0k