Typography

Procore’s typography was chosen to enhance legibilty as users skim through the large content areas in our products. Consolidating and streamlining typography across Procore tools also means we are giving our users a consistent experience that can scale for the future.
Developer GuidelinesFigma Doc

Our Typeface: Inter

Using Inter as our main web typeface means allowing our content to speak 
for itself. As a typeface created specifically for user interfaces, it allows for optimal legibility at small sizes and variable font adjustment on web – all without lacking personality.
Download Inter

The System

Name
Header 1
Header 2
Header 3
Font Size
Body*
16px
24px
0.15px
Small Text*
Small Text*
Small Text*
Small Text*
32px
0.15px
24px
0.15px
28px
20px
0.15px
20px
14px
Letter Spacing
Line-height
*Body and Small support semibold and italic styling.

**Tables currently use the outlier sizes of 11px for the table header and 13px for table content. To optimize the system, we are considering consolidating these sizes, and a solution is pending.

Application

The examples below depict how our type styles are used in context of a main 
page layouts.

Scale

Read Page
List Page

Style and Size

Read Page
List Page