Typography

Typographic standards that power the Arc Design System.

The goal of Arc's typography is to create consistent relationships but isn't too rigid feeling when looking at dense areas of content.

#Type Heirarchy

The typography system has a small number of base styles in the general heirarchy which will help manage the CSS and provide clear direction for designers. The system supports several layers of headings, body copy and a base for interface text.

font-size: 41.89px
Line-height: 50px
Letter-spacing: -0.02em

#H2 Section Header

font-size: 32px
Line-height: 40px
Letter-spacing: -0.02em

#H3 Subsection Header

font-size: 25.89px
Line-height: 30px
Letter-spacing: -0.02em

H4 Subsection Header

font-size: 18.72px
Line-height: 24px
Letter-spacing: -0.02em

H5 Subsection Header

font-size: 16px
Line-height: 18.7px
Font-weight: 700
Letter-spacing: -0.02em

H6 Subsection Header

font-size: 14px
Line-height: 16px
Font-weight: 700
Letter-spacing: -0.02em

Body Copy and interface styles

font-size: 16px
Line-height: 18.7px
Letter-spacing: -0.02em

Small Body Copy