Colors

Typography

Font Size

8px
12px
16px
24px

Font Weight

300
400
600
700

Line Height

1.5
1.75
1.25

Spacing

8px
16px
24px
32px
40px

Border Radius

4px
8px
16px
24px

Border Width

0.3px
0.5px
0.9px
2.4px

Colors

background
Light
#F0F2F5
Dark
#18191A
foreground
Light
#1C1E21
Dark
#E4E6EB
primary
Light
#1877F2
Dark
#1877F2
secondary
Light
#42B72A
Dark
#42B72A
accent
Light
#F0F2F5
Dark
#242526
muted
Light
#606770
Dark
#B0B3B8
card
Light
#FFFFFF
Dark
#242526
cardForeground
Light
#1C1E21
Dark
#E4E6EB
border
Light
#DDDFE2
Dark
#3A3B3C

Typography

Font Family of headingHelvetica
Font Family of sansHelvetica

Font Size

sm8px
The quick brown fox jumps over the lazy dog.
md12px
The quick brown fox jumps over the lazy dog.
lg16px
The quick brown fox jumps over the lazy dog.
xl24px
The quick brown fox jumps over the lazy dog.

Font Weight

light300
The quick brown fox jumps over the lazy dog.
normal400
The quick brown fox jumps over the lazy dog.
semibold600
The quick brown fox jumps over the lazy dog.
bold700
The quick brown fox jumps over the lazy dog.

Line Height

normal1.5
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
relaxed1.75
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
tight1.25
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.

Spacing

sm8px
md16px
lg24px
xl32px
2xl40px

Border Radius

sm4px
md8px
lg16px
xl24px

Border Width

sm0.3px
md0.5px
lg0.9px
xl2.4px