№ 10

Label Swatches with Contrasting Text

Posted on by Amy Cesal

A low-effort way to improve accessibility guidance is to annotate color swatches with recommended foreground text colors.

The Justice Innovation Lab guide demonstrates this pattern by indicating when black or white text should be used on each swatch. This helps designers make faster, safer choices during implementation.

It is still important to verify contrast thresholds for each swatch/background pairing against WCAG targets.

Portrait of Amy Cesal

Amy Cesal is a freelance information designer who helps organizations build data visualization practices and style guides.