Native Text Combinations
Text combinations involve stacked text styles. These are built with hierarchy and legibility in mind.
Types of Text Combinations
Content Header
Content Header lockups are typically used at the top of a page. Can be found in booking flows, general content pages.
a-text-h3:
font-weight: bold
font-size: 20px
font-color: text-black
padding-bottom: 8px
a-text-paragraph
font-weight: book
font-size: 16px
font-color: slate-dark
line-height: 1.5UI Header
UI Header lockups are typically used in modals and half sheets.
a-text-h2:
font-weight: bold
font-size: 20px
font-color: text-black
padding-bottom (halfsheets): 16px
padding-bottom (modals): 24px
a-text-paragraph:
font-weight: book
font-size: 16px
font-color: slate-dark
line-height: 1.5Content Subheader
Content subheader lockups are used in content pages that need further separation/hierarchy.
a-text-h4:
font-weight: bold
font-size: 16px
font-color: text-black
padding-bottom: 8px
a-text-paragraph:
font-weight: book
font-size: 16px
font-color: text-black
line-height: 1.5Picker Text
Picker Text lockups are used in radio or checkbox pickers.
a-text-paragraph:
font-weight: book
font-size: 16px
font-color: text-black
padding-bottom: 8px
a-text-paragraph-slate-dark:
font-weight: book
font-size: 16px
font-color: slate-darkLast updated
Was this helpful?