'%20stroke='%23E0E0E0'%20stroke-width='2'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_2682_149131'%20x1='7'%20y1='4'%20x2='23.0784'%20y2='26.6541'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%233A3AEA'/%3e%3cstop%20offset='0.592633'%20stop-color='%23DF13F9'/%3e%3cstop%20offset='0.763157'%20stop-color='%23F0558E'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e)
Typography · Learn · Guide
Size within a role
A size tells you how prominent text should be inside the role you already chose. Pick the role first for meaning; then choose Large, Medium or Small.
Title at every size — tap to pick
Relative, not absolute
Size moves within the tier
A Small in a loud role still beats a Large in a quiet one. Size moves you within the tier the role already set.
displaySmall · 49pxAg
> bodyLarge · 20pxAg
Which size to pick
Large
The most prominent instance of this role on the screen.
Medium
The default. Reach for this unless you have a reason not to.
Small
Tighter or denser layouts, or a secondary instance of the role.