Typography

In the Axiomatic Color, you don’t pick text colors. You pick Text Hierarchy.

The system automatically calculates the correct color for each level of hierarchy based on the surface it sits on, ensuring APCA compliance.

Text Hierarchy

The system provides four levels of text hierarchy, plus a link style.

Class	Role	Usage
text-strong	Headings	Headings, titles, critical data. Highest contrast.
text-body	Body	Paragraphs, long-form text. Comfortable for reading.
text-subtle	Metadata	Helper text, timestamps, secondary info.
text-subtlest	Disabled	Placeholders, disabled states. Low emphasis.
text-link	Interactive	Hyperlinks and clickable text elements.

The Quick Brown Fox

The quick brown fox jumps over the lazy dog. This is a sample of body text that is easy to read.

Posted 2 hours agoRead more ->

Context Adaptation

The power of these classes is that they adapt to their container.

Light Context

Strong

Body

Subtle

Dark Context

Strong

Body

Subtle

Notice how text-strong is dark on the card but light on the spotlight. You didn’t have to change the class name.