Style Guide
Search…
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.
1
a-text-h3:
2
font-weight: bold
3
font-size: 20px
4
font-color: text-black
5
padding-bottom: 8px
6
7
a-text-paragraph
8
font-weight: book
9
font-size: 16px
10
font-color: slate-dark
11
line-height: 1.5
Copied!

UI Header

UI Header lockups are typically used in modals and half sheets.
1
a-text-h2:
2
font-weight: bold
3
font-size: 20px
4
font-color: text-black
5
padding-bottom (halfsheets): 16px
6
padding-bottom (modals): 24px
7
8
a-text-paragraph:
9
font-weight: book
10
font-size: 16px
11
font-color: slate-dark
12
line-height: 1.5
Copied!

Content Subheader

Content subheader lockups are used in content pages that need further separation/hierarchy.
1
a-text-h4:
2
font-weight: bold
3
font-size: 16px
4
font-color: text-black
5
padding-bottom: 8px
6
7
a-text-paragraph:
8
font-weight: book
9
font-size: 16px
10
font-color: text-black
11
line-height: 1.5
Copied!

Picker Text

Picker Text lockups are used in radio or checkbox pickers.
1
a-text-paragraph:
2
font-weight: book
3
font-size: 16px
4
font-color: text-black
5
padding-bottom: 8px
6
7
a-text-paragraph-slate-dark:
8
font-weight: book
9
font-size: 16px
10
font-color: slate-dark
Copied!