Skip to main content

Typography

Typography is a crucial element of our design system, ensuring readability and visual harmony across all applications. This section offers an overview of font formats based on a modular scale, which helps maintain consistency and balance. Expand the rows to preview each font and see detailed information on its usage and specifications.

Typography - Usage

Headings

Use headings from H1 to H6 for headlines to organize content and indicate the hierarchy of information.

Body text

Use body text for content that includes multiple lines, paragraphs, and messages to ensure readability and a comfortable reading experience.

Label

Use label for texts labels or single line texts in components.

Display

Use display text for large number/text displays, single-line, like KPI values on cards.

Code

Use code text for code snippets, code keywords, code editor etc.