Framer Design System
Typography
Roboto
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890
Regular
Text900
Text800
Text700
Text600
Text500
Text400
Text300
Text200
Text100
Text50
Medium
Text900
Text800
Text700
Text600
Text500
Text400
Text300
Text200
Text100
Text50
Bold
Text900
Text800
Text700
Text600
Text500
Text400
Text300
Text200
Text100
Text50
Colors
White
#FFFFFF
Base
10
#F8F8F8
20
#CCCCCC
30
#B3B3B3
40
#999999
50
#808080
60
#666666
70
#4D4D4D
80
#333333
90
#191919
100
#000000
Neutral
70
#0B5AE2
80
#0948B5
90
#073B93
100
#062D71
10
#E7EFFC
20
#C2D6F8
30
#9DBDF3
40
#79A4EF
50
#548CEB
60 - Primary
#4385F6
Blue
70 - Primary
#FD784F
80
#CA603F
90
#A44E33
100
#7F3C28
10
#FFF2ED
20
#FFDDD3
30
#FEC9B9
40
#FEB59E
50
#FEA184
60
#FD8C69
Orange
70
#00B88A
80
#009973
90
#007A5C
100
#005C45
10
#D9F7F0
20
#B3F0E0
30
#8CE8D1
40
#66E0C2
50
#40D9B3
60 - Primary
#00CC99
Green
70
#D78F03
80
#B17602
90
#986502
100
#724C01
10
#FFF2D9
20
#FEE5B3
30
#FED88E
40
#FECB68
50
#FEBE42
60 - Primary
#FDA803
Yellow
70
#CA3333
80
#A42A2A
90
#8B2323
100
#721D1D
10
#FFE2E2
20
#FFCFCF
30
#FEB3B3
40
#FE9696
50
#FD6666
60 - Primary
#FD4040
Red
Buttons
Blue Solid
Small
Button Label
Medium
Button Label
Large
Button Label
Extra Large
Button Label
Blue Outline
Small
Button Label
Medium
Button Label
Large
Button Label
Extra Large
Button Label
Orange Solid
Small
Button Label
Medium
Button Label
Large
Button Label
Extra Large
Button Label
Orange Outline
Small
Button Label
Medium
Button Label
Large
Button Label
Extra Large
Button Label
Secondary
Small
Button Label
Medium
Button Label
Large
Button Label
Extra Large
Button Label
Ghost
Small
Button Label
Medium
Button Label
Large
Button Label
Extra Large
Button Label
Icons
Standard Iconography
Choose the specific icon from the Variants menu under the Icons asset. Freely resize each instance based on the required specification of the page or area.
Dividers
Standard Divider
Dotted Divider
Spacing & Grids
Spacing Units
4px
8px
12px
16px
24px
32px
40px
48px
52px
60px
64px
72px
80px
88px
96px
104px
112px
120px
128px
140px
152px