Typography

To ensure simplicity and consistency throughout the app, typography is limited to specific sizes and weights. Only the Lato typeface is used to ensure legibility at small sizes.

 
 
Display Text
Name Size Weight Color
NavigationBarTitle 20 Regular #primary2
TabBarItemTitle 10 Regular #gray2/#primary1
SectionTitle 12 Regular/UpperCase #gray2
 
Button Text
Name Size Weight Color
ButtonTitle1 15 Semi-Bold #primary2
ButtonTitle2 15 Semi-Bold #white/#primary1
ButtonTitle3 18 Semi-Bold #white/#primary1
 
Text
Name Size Weight Color
Caption1 12 Regular #gray2
Caption2 14 Regular #gray1
Body1 14 Regular #gray1
Body2 15 Regular #gray1
Body3 16 Regular #gray1
Body4 18 Regular #gray1
Body5 20 Regular #gray1
HeadLine1 18 Regular #gray1
HeadLine2 19 Regular #gray1
HeadLine3 20 Regular #gray1
HeadLine4 22 Regular #gray1
XLarge1 25 Regular #gray1
XLarge2 35 Regular #gray1
XLarge3 65 Regular #gray1
XLarge4 90 Regular #gray1
XLarge5 55 Regular #gray1