Primary Headline
Make better decisions, together
Garnett, Medium120% line height, -2% letter spacing
Garnett, Medium & Regular, 60px / 120%
Garnett, Medium & Regular, 48px / 120%
How do we use typography?
Display
Light
Regular
Medium
Semi bold
Garnett
Long-form
Light
Regular
Medium
Semi bold
ABC Arizona
Secondary headlines
Answers at your fingertips
Garnett, Medium120% line height, -2% letter spacing
Eyebrows & Captions
MEASURE
Garnett, Medium20% letter spacing
Monitor growth and engagement. Know how current trends compare to the past.
Garnett, Regular168% line height, 2% letter spacing,Stylistic Alternates: Neo-Grotesk ‘r’ and ‘g’
Body copy - short Form
Every day, people give feedback through billions of actions they perform in your product. Through an interactive UI, you can ask questions and dig in deeper to get clarity.
Garnett, Regular
150% line height,
Stylistic Alternates: Neo-Grotesk ‘r’ and ‘g’
Body Copy – Long form
When the team was looking for a best-in-class product analytics platform, Mixpanel checked all the boxes. The team at AB Tasty wanted an intuitive and easy-to-use interface that would give Product Management, Product Marketing, and others autonomy to pull data. Additionally, we wanted a tool that integrated with tools in our tech stack like Appcues and Segment so data from other sources could be received.
Arizona Text, Variable
140% line height
display-xl
Medium
Garnett, Medium, 128px / 120%
display-lg
Medium
Garnett, Medium, 96px / 120%
display-md
Medium
Garnett, Medium, 80px / 120%
display-sm
Medium
Garnett, Medium, 72px / 120%
heading-xxl
Medium
heading-xxl
Regular
heading-xl
Medium
heading-xl
Regular
heading-lg
Medium
Garnett, Medium & Regular, 36px / 120%
heading-md
Medium
Garnett, Medium, 28px / 140%
Stylistic Alternates, SS01
heading-sm
Medium
Garnett, Medium, 22px / 140%
Stylistic Alternates, SS01
heading-xs
Medium
Garnett, Medium, 18px / 140%
Stylistic Alternates, SS01
body-xxl
Regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Regular, 36px / 150%Stylistic Alternates, SS01
body-xxl-serif
Regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (340), 38px / 140%Regular
body-xl
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Regular, 28px / 150%Stylistic Alternates, SS01
body-xl-serif
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (340), 30px / 140% Regular
body-lg
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Regular, 22px / 160%Stylistic Alternates, SS01
body-lg-serif
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (340), 24px / 150%Regular
body-md
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Regular, 18px / 160%Stylistic Alternates, SS01
body-md-serif
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (340), 20px / 150%Regular
body-sm
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Regular, 16px / 160%Stylistic Alternates, SS01
body-sm-serif
regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (340), 18px / 150%Regular
body-xxl
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Medium, 36px / 150%Stylistic Alternates, SS01
body-xxl-serif
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (450), 38px / 140%Regular
body-xl
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Medium, 28px / 150%Stylistic Alternates, SS01
body-xl
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (450), 30px / 140% Regular
body-lg
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Medium, 22px / 160%Stylistic Alternates, SS01
body-lg
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (450), 24px / 150%Regular
body-md
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Medium, 18px / 160%Stylistic Alternates, SS01
body-md
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (450), 20px / 150%Regular
body-sm
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett (default), Medium, 16px / 160%Stylistic Alternates, SS01
body-sm
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Arizona Text Variable (450), 18px / 150%Regular
caption-sm
Regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett Regular & Medium, 14px / 160%Stylistic Alternates, SS01
caption-sm
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
caption-xs
Regular
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
Garnett Regular & Medium, 12px / 160%Stylistic Alternates, SS01
caption-xs
Medium
Anyone can pick it up and learn about our customer behavior, digging deep into metrics that matter to them, and know that the data is accurate.
eyebrow-lg
Bold
Mono-type
Apercu Mono, Bold, 18px
eyebrow-sm
Bold
Mono-type
Apercu Mono, Bold, 14px
How do we use typography? What typefaces do we use and when? What styling is available to usable?