GUIDE深度 · Deep dive
Making Picked Colors Readable
A color picked from an image can look good and still be unreadable. Text/background contrast should be at least 4.5:1 (3:1 for large text); pair dark backgrounds with light text and avoid low-contrast midtones. Check with the site's contrast tool.
Body text at least 4.5:1.
Large text at least 3:1.
Do not rely on color alone for status.
Pick a brand color, then derive tints/shades for states.
Avoid large areas of highly saturated color behind text.
FAQ
Is 4.5:1 mandatory?
It is the WCAG AA body-text requirement; AAA is stricter.
How to check quickly?
Use the site's contrast tool or browser DevTools.