enwarp.io1
Colors
Spacing
xs
0.44rem
sm
0.67rem
md
1rem
lg
1.5rem
xl
2.25rem
gutter
1.5rem
margin
2rem
Rounded
none0px
sm0.5rem
md1rem
lg1.5rem
xl2rem
full9999px
Shadows
sm
0px 0px 8px 1.6px rgba(22, 63, 80, 0.2)
md
0px 5px 8px 1.6px rgba(22, 63, 80, 0.1)
lg
6px 6px 9px rgba(0, 0, 0, 0.2)
xl
12px 12px 50px rgba(0, 0, 0, 0.4)
Font
Poppins
Aa Bb Cc 0123
ABCDEFGHIJKLMNOPQRSTUVWXYZ · abcdefghijklmnopqrstuvwxyz
RobotoSlab
Aa Bb Cc 0123
ABCDEFGHIJKLMNOPQRSTUVWXYZ · abcdefghijklmnopqrstuvwxyz
Heading
Headline DisplayRobotoSlab · 60.8px · 700
Display headline
Headline LGRobotoSlab · 48px · 700
The quick brown fox
Headline MDRobotoSlab · 2rem · 700
Design systems at scale
Headline SMRobotoSlab · 1.5rem · 700
Color, type, and spacing
Text
Body LGPoppins · 1.2rem · 400
The quick brown fox jumps over the lazy dog. Lead paragraph copy for marketing pages.
Body MDPoppins · 1rem · 400
The quick brown fox jumps over the lazy dog. Standard body copy throughout the application.
Body SMPoppins · 0.875rem · 400
Supporting text, captions, and metadata appear at this size.
Label LGPoppins · 1rem · 600
Button label · Primary action
Label MDPoppins · 0.875rem · 600
Form label · Required field
Label SMPoppins · 0.75rem · 500
Badge · Tag · Micro-copy