Typography
Learn about the typefaces and typescale used in Qasa Design System.
Typefaces
Our typeface family is called Qasa Diatype Rounded, which is designed by Dinamo Typefaces.
The rounded features connects with our logotype, and the use of semi-mono further establishes the duality between something structured and something tactile and warm.
Don’t have the font files?
Reach out to the QDS team on Slack to get access to the font files.
Typescale
Our typescale helps us to create a consistent hierarchy by defining pre-set combinations of styles such as font size, line height, and letter spacing. They can be consumed as Tailwind CSS classes or as text styles in Figma.
| Example | Class name |
|---|---|
Display lg | type-display-lg |
Display md | type-display-md |
Display sm | type-display-sm |
Title lg | type-title-lg |
Title md | type-title-md |
Title sm | type-title-sm |
Title xs | type-title-xs |
Title 2xs | type-title-2xs |
Label md | type-label-md |
Label sm | type-label-sm |
Body xl | type-body-xl |
Body lg | type-body-lg |
Body md | type-body-md |
Body sm | type-body-sm |