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
| Class | Also on | Role |
|---|---|---|
.h1 | h1 | Display |
.h2 | h2 | Page title |
.h3 | h3 | Section |
.h4 | h4, blockquote | Subsection |
.h5 | h5 | Minor heading |
.h6 | h6 | Label heading |
.p | p | Body |
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.