Color Contrast Accessibility
Go directly to Contrast Grid to edit the color grid using the colors from the Kadence color palette.
Color Tools:
- Contrast Grid
- Web Aim Contrast Checker (creates accessible options)
- Accessible Color Palette Generator
- Accessible Color Palette Builder
- A11y Rocks
Background
Text
|
#FFFFFF
|
#F7FAFC
|
#EDF2F7
|
#5C6780
|
#0C1625
|
#2B2A83
|
#690000
|
#E08A21
|
#E02A21
|
---|---|---|---|---|---|---|---|---|---|
White
#FFFFFF
|
Text
AA
5.6
|
Text
AAA
18.1
|
Text
AAA
11.9
|
Text
AAA
13.1
|
Text
AA
4.6
|
||||
Lighter Background
#F7FAFC
|
Text
AA
5.4
|
Text
AAA
17.3
|
Text
AAA
11.3
|
Text
AAA
12.5
|
|||||
Subtle Background
#EDF2F7
|
Text
AA
5
|
Text
AAA
16.1
|
Text
AAA
10
|
Text
AAA
11.6
|
|||||
Subtle Text
#5C6780
|
Text
AA
5.6
|
Text
AA
5.4
|
Text
AA
5
|
||||||
Medium Text
#0C1625
|
Text
AAA
18.1
|
Text
AAA
17.3
|
Text
AAA
16.1
|
Text
AA
6.7
|
|||||
Strong Text
#2B2A83
|
Text
AAA
11.9
|
Text
AAA
11.3
|
Text
AAA
10
|
||||||
Strongest Text
#690000
|
Text
AAA
13.1
|
Text
AAA
12.5
|
Text
AAA
11.6
|
Text
AA
4.8
|
|||||
Accent-Alt
#E08A21
|
Text
AA
6.7
|
Text
AA
4.8
|
|||||||
Accent
#E02A21
|
Text
AA
4.6
|
||||||||
AAA Pass, AAA (7+)
AA Pass, AA (4.5+)
AA18 Pass, Large Text Only (3+)
DNP Does Not Pass
|