Colors
Color distinguishes our brand and helps us create consistent experiences across products.
Neutral
Gray is a neutral color and is the foundation of the color system. Almost everything in UI design — text, form fields, backgrounds, dividers — are usually gray.
0
#FFFFFF
10
#F9FAFB
20
#E5E7EB
30
#D1D5DB
40
#AEB2BA
50
#6B7280
60
#4B5563
70
#374151
80
#1F2937
90
#111827
100
#030712
Inter Tight
Bold
SemiBold
Medium
Regular
Aa
Heading - Desktop
Heading 1
Inter Tight/ Bold
104px
100%
Heading 1
Heading 2
Inter Tight/ SemiBold
72px
100%
Heading 2
Heading 3
Inter Tight/ SemiBold
64px
100%
Heading 3
Heading 4
Inter Tight/ SemiBold
56px
100%
Heading 4
Heading 5
Inter Tight/ SemiBold
40px
100%
Heading 5
Heading 6
Inter Tight/ SemiBold
32px
100%
Heading 6
Heading - Mobile
Heading 1
Inter Tight/ Bold
64px
100%
Heading 1
Heading 2
Inter Tight/ SemiBold
56px
100%
Heading 2
Heading 3
Inter Tight/ SemiBold
48px
100%
Heading 3
Heading 4
Inter Tight/ SemiBold
40px
100%
Heading 4
Heading 5
Inter Tight/ SemiBold
32px
100%
Heading 5
Body
Body Extra-Large Bold
Inter Tight/ SemiBold
28px
120%
The quick brown fox
Body Extra-Large Medium
Inter Tight/ Medium
28px
120%
The quick brown fox
Body Extra-Large Regular
Inter Tight/ Regular
28px
120%
The quick brown fox
Body Large Bold
Inter Tight/ SemiBold
20px
130%
The quick brown fox
Body Large Medium
Inter Tight/ Medium
20px
130%
The quick brown fox
Body Large Regular
Inter Tight/ Regular
20px
130%
The quick brown fox
Body Large Bold
Inter Tight/ SemiBold
18px
150%
The quick brown fox
Body Large Medium
Inter Tight/ Medium
18px
150%
The quick brown fox
Body Large Regular
Inter Tight/ Regular
18px
150%
The quick brown fox
Body Semi-Large Bold
Inter Tight/ SemiBold
16px
150%
The quick brown fox
Body Semi-Large Medium
Inter Tight/ Medium
16px
150%
The quick brown fox
Body Semi-Large Regular
Inter Tight/ Regular
16px
150%
The quick brown fox
Body Small Bold
Inter Tight/ SemiBold
14px
150%
The quick brown fox
Body Small Medium
Inter Tight/ Medium
14px
150%
The quick brown fox
Body Small Regular
Inter Tight/ Regular
14px
150%
The quick brown fox
Caption Bold
Inter Tight/ SemiBold
12px
150%
The quick brown fox
Caption Medium
Inter Tight/ Medium
12px
150%
The quick brown fox
Caption Regular
Inter Tight/ Regular
12px
150%
The quick brown fox