Typography sets the tone and flow of an interface's content. Looker's design system has built-in typography aims to create a harmonious hierarchy, maximize legibility, and present the content as clearly as possible.
body font is Roboto, a sans serif typeface. It was chosen for its open and friendly appearance as well as having excellent legibility for digital applications.
brand font defaults to Roboto a sans serif typeface. It is used for headings, buttons and tabs, this can be set independently of the body font in the theme.
code font is Roboto Mono, a fixed-width typeface. It is used for code and structured data display.
|400||Roboto is the typographic base for the tone and content of Looker's design system|
|500||Roboto is the typographic base for the tone and content of Looker's design system|
|600||Roboto is the typographic base for the tone and content of Looker's design system|
|700||Roboto is the typographic base for the tone and content of Looker's design system|
The type scale is designed to provide consistent and harmonious typographic styles.
|Specimen||Font Size||Line Height||Reference|
|Looker Components are great||44px||52px|
|Looker Components are great||36px||44px|
|Looker Components are great||28px||36px|
|Looker Components are great||24px||36px|
|Looker Components are great||22px||28px|
|Looker Components are great||18px||24px|
|Looker Components are great||16px||24px|
|Looker Components are great||14px||20px|
|Looker Components are great||12px||16px|
|Looker Components are great||11px||16px|