Typography

Typography

Text Styles

Discover the premium typography scales and font styling guidelines used throughout the PiruAdmin dashboard.

Standard Headings

Standard HTML headings styled with perfect visual proportions.

Heading 1 (2.03rem)

Heading 1


Heading 2 (1.62rem)

Heading 2


Heading 3 (1.35rem)

Heading 3


Heading 4 (1.13rem)

Heading 4


Heading 5 (1.01rem)
Heading 5

Heading 6 (0.875rem)
Heading 6
Display Headings & Lead

Large display headings when extra visual emphasis is required.

Display 1

D1


Display 4

D4


Lead Paragraph

This is a lead paragraph. It stands out with a slightly larger font size and lighter weight for key intro texts.

Inline Text Elements & Utilities

Helper classes for styling and aligning inline paragraph text.

Styled Paragraphs & Mutes

You can use the mark tag to highlight text.

This line of text will render as underlined.

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

This is a secondary muted paragraph text.

Blockquotes & Lists

"Simplicity is the ultimate sophistication."

Leonardo da Vinci in Art & Design
  • Inline Item 1
  • Inline Item 2
  • Inline Item 3