Typography

Typographic system establishes scale, sizes and weight of text.

CSS Tokens SASS Tokens Style Dictionary Component Types

Typography

Typographic system establishes scale, sizes and weight of text.

Typeface

Inter

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz

1234567890'?"!"(%)[#]@/&\-+÷×=®©$€£¥¢:;,.*

Hierarchy

Use for palette of colors containing many shades.

Heading 1

Inter / 50056px / 1.1

Almost before we knew it, we had left the ground.

Heading 2

Inter / 50040px / 1.1

Almost before we knew it, we had left the ground.

Heading 3

Inter / 50032px / 1.3

Almost before we knew it, we had left the ground.

Heading 4

Inter / 50028px / 1.3

Almost before we knew it, we had left the ground.

Heading 5

Inter / 50024px / 1.3

Almost before we knew it, we had left the ground.

Heading 6

Inter / 60020px / 1.3

Almost before we knew it, we had left the ground.

Subheading

Inter / 70018px / 1.6

Almost before we knew it, we had left the ground.

Blockquote

Inter / 40024px / 1.3

Almost before we knew it, we had left the ground.

Button/Text Large

Inter / 60016px / 1.3

Almost before we knew it, we had left the ground.

Button/Text Medium

Inter / 60014px / 1.3

Almost before we knew it, we had left the ground.

Button/Text Small

Inter / 60012px / 1.3

Almost before we knew it, we had left the ground.

Form/Help

Inter / 40012px / 1.6

Almost before we knew it, we had left the ground.

Form/Label

Inter / 40012px / 1.6

Almost before we knew it, we had left the ground.

Form/Placeholder Large

Inter / 40016px / 1.3

Almost before we knew it, we had left the ground.

Form/Placeholder Medium

Inter / 40014px / 1.4

Almost before we knew it, we had left the ground.

Form/Placeholder Small

Inter / 40012px / 1.7

Almost before we knew it, we had left the ground.

Form/Text Large

Inter / 60016px / 1.3

Almost before we knew it, we had left the ground.

Form/Text Medium

Inter / 60014px / 1.4

Almost before we knew it, we had left the ground.

Form/Text Small

Inter / 60012px / 1.7

Almost before we knew it, we had left the ground.

LG/Base

Inter / 40018px / 1.6

Almost before we knew it, we had left the ground.

LG/Medium

Inter / 60018px / 1.6

Almost before we knew it, we had left the ground.

LG/Strong

Inter / 70018px / 1.6

Almost before we knew it, we had left the ground.

MD/Base

Inter / 40016px / 1.6

Almost before we knew it, we had left the ground.

MD/Medium

Inter / 60016px / 1.6

Almost before we knew it, we had left the ground.

MD/Strong

Inter / 70016px / 1.6

Almost before we knew it, we had left the ground.

SM/Base

Inter / 40014px / 1.6

Almost before we knew it, we had left the ground.

SM/Medium

Inter / 60014px / 1.6

Almost before we knew it, we had left the ground.

SM/Strong

Inter / 70014px / 1.6

Almost before we knew it, we had left the ground.

XL/Base

Inter / 40020px / 1.6

Almost before we knew it, we had left the ground.

XL/Medium

Inter / 60020px / 1.6

Almost before we knew it, we had left the ground.

XL/Strong

Inter / 70020px / 1.6

Almost before we knew it, we had left the ground.

XS/Base

Inter / 40012px / 1.6

Almost before we knew it, we had left the ground.

XS/Medium

Inter / 60012px / 1.6

Almost before we knew it, we had left the ground.

XS/Strong

Inter / 70012px / 1.6

Almost before we knew it, we had left the ground.

XXL/Base

Inter / 40022px / 1.6

Almost before we knew it, we had left the ground.

XXL/Medium

Inter / 60022px / 1.6

Almost before we knew it, we had left the ground.

XXL/Strong

Inter / 70022px / 1.6

Almost before we knew it, we had left the ground.

XXS/Base

Inter / 40010px / 1.6

Almost before we knew it, we had left the ground.

XXS/Medium

Inter / 60010px / 1.6

Almost before we knew it, we had left the ground.

XXS/Strong

Inter / 70010px / 1.6

Almost before we knew it, we had left the ground.