Typography System

Demonstrating font family ('Inter') usage across headings, body copy, and utility text, emphasizing clarity and hierarchy.

Text Styles

H1: Headline (3rem)

Used for main page titles. Bold, commanding, and visually distinct.

H2: Section Title (1.8rem)

Used to segment major component areas. Clearly marked with an accent border.

H3: Subheading (e.g., Card Title)

H3 is used for smaller grouping titles, often seen within components.

This is large body copy (Slightly increased base size for readability). Used for important contextual paragraphs.

This is standard body copy, used for general content, maintaining excellent contrast against the dark background.

This is small body copy (0.9rem). Used for captions, secondary labels, and helper text, ensuring it doesn't compete with main content.

Inline code elements for technical terms.
Built with Karbon Sites