Typography
Typography is the system of fonts. Each font style and size conveys hierarchy and helps in better readability.
Font Family
In Prism Design System, we are using the Lexend font that is designed by Google.
It's scientifically proven to impart minimal cognitive load
Is open-sourced
Cross-platform support
Usage guide
The text style nomenclature has been divided into two broad categories-
Display — To be used for larger font size, such as the banner text, heading and titles.
Text — For more mundane and regular use case. Such as body text, description, and UI elements such as buttons, tags and menu items.
Relation and dependence on 4 grid system
Notice the smaller text line heights follow a strict 4px grid, i.e., they are divisible by 4.
This is because these smaller styles are often going to be used in UI elements.
Suppose if we have odd/non-multiple of 4 text line height it becomes a tiresome for any designer to arrange and fit those UI elements in a 4px grid system.
Consider the following case where our input field height is anchored to 4px grid i.e. height of 36px
Last updated