Aura Design System

Typography

The fluid type scale as CSS classes. Aura does not ship a Typography component.

Aura sets type in CSS. Headings and paragraphs use clamp() from custom properties on the element. A Typography component would only repeat those classes, so this page is the specimen.

The full rules, the 17px form floor, and the font stacks are on Typography.

Scale

ClassAlso onRole
.h1h1Display
.h2h2Page title
.h3h3Section
.h4h4, blockquoteSubsection
.h5h5Minor heading
.h6h6Label heading
.ppBody

text-sm and text-xs are the only Tailwind sizes for small UI text. They stay off input, textarea, and select.

Specimen

Heading one

Heading two

Heading three

Heading four

Heading five
Heading six

Body copy uses the paragraph clamp. The root font size is 17px, so 1rem already meets the mobile floor.

A non-heading can take .h4 when the outline should stay flat and the size should match a fourth-level heading.

Editorial emphasis uses the same fluid size as h4.

Small utility text uses text-sm.

Micro labels use text-xs.

On this page