display-1
Large, one-off headers, usually at the top of the page
Font Size: 66px | Line Height: 77px | Font weight: 100 | Font family: VisbyCF-Heavy |
---|
headline
Section heading corresponding to the <h1>
tag.
Font Size: 44px | Line Height: 50px | Font weight: 100 | Font family: VisbyCF-Heavy |
---|
title
Section heading corresponding to the <h2>
tag.
Font Size: 34px | Line Height: 38px | Font weight: 100 | Font family: VisbyCF-DemiBold |
---|
subheading-2
Section heading corresponding to the <h3>
tag.
Font Size: 24px | Line Height: 29px | Font weight: 100 | Font family: VisbyCF-Medium |
---|
subheading-1
Section heading corresponding to the <h4>
tag.
Font Size: 18px | Line Height: 24px | Font weight: 100 | Font family: VisbyCF-Medium |
---|
body-1
Body 1
Base body text
Font Size: 14px | Line Height: 17px | Font weight: 400 | Font family: Lato |
---|
body-2
Body 2
Bolder body text
Font Size: 14px | Line Height: 17px | Font weight: 700 | Font family: Lato |
---|
caption
Caption text
Smaller body and hint text
Font Size: 12px | Line Height: 15px | Font weight: 400 | Font family: Lato |
---|
button
Buttons and anchors.
Font Size: 16px | Line Height: 19px | Font weight: 700 | Font family: Lato |
---|
input
Input field text
Form input fields.
Font Size: 15px | Line Height: 18px | Font weight: 400 | Font family: Lato |
---|
Selection
Primary
Secondary
Switches and sliders
Primary
Secondary
Cards
Title
Subhead
Text Field
Primary
Secondary