Can you read me now?

Have you visited a website with text like this and wondered why it was so hard to read?

Let’s make it legible.

Clarity is not a feature. It is infrastructure for the next era of human coordination. That is why we express our category-defining ideas in the faintest text our design system allows. The contrast ratio passes WCAG AAA, so naturally our design review considers the matter closed. If you can read this, you’re too close to the problem space.

Keep adjusting.

APCA suggests at least 31px at weight 400 for these colors.

Colors Text Background

CSS colors supported: hex, rgb(), hsl(), oklch(), named colors, and text alpha.

Type Size 14px Weight 400

The example text is in Inter (opens in a new tab), a popular font.

APCA contrast Lc −51.4 Light text on dark

WCAG 2 AAA 8.13:1 AA and AAA pass for standard text

Why APCA?

Traditional contrast checks can pass text that still feels painfully hard to read. APCA accounts for size, weight, and light-on-dark text so its guidance better reflects comfortable reading. Read the official overview (opens in a new tab).

Lc 90Preferred body text

Lc 75Minimum body text

Lc 60Non-body text and UI

Lc 45Large headlines

Lc 30Spot and placeholder text