25 lines
722 B
Markdown
25 lines
722 B
Markdown
|
---
|
||
|
|
title: Color Contrast
|
||
|
|
parent: Colors
|
||
|
|
nav_order: 3
|
||
|
|
---
|
||
|
|
|
||
|
|
If you want to develop a good theme, there are some accessibility rules.
|
||
|
|
|
||
|
|
Color contrast between text and its background must meet required [WCAG standards](https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html).
|
||
|
|
|
||
|
|
The contrast requirements are:
|
||
|
|
|
||
|
|
* 4.5:1 for normal text
|
||
|
|
* 3:1 for large text (>24px)
|
||
|
|
* 3:1 for UI elements and graphics
|
||
|
|
* No contrast requirement for decorative and disabled elements
|
||
|
|
|
||
|
|
You can check and modify color contrast directly in the Sampler app.
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
Click on any block to run contrast checker and get more detailed info.
|
||
|
|
|
||
|
|
|