Style guide
01
Fonts
H1
TT Autonomous trl
Heading
H2
TT Autonomous trl
Heading
H3
TT Autonomous trl
Heading
H4
TT Autonomous trl
Heading
p
Roboto flex 28 (Regular, Lowercase) -- width: 150; weight: 250
Jim, you’re 6’11 and you weigh 90 pounds. Gumby has a better body than you. Boom, roasted. Dwight, you’re a kiss ass. Boom, roasted. Pam, you failed art school. Boom, roasted. Meredith, you’ve slept with so many guys, you’re starting to look like one. Boom, roasted. Kevin, I can’t decide between a fat joke and a dumb joke. Boom, roasted. Creed, your teeth called, your breath stinks. Boom, roasted.
p
Roboto flex 28 (Medium, Lowercase) -- width: 150; weight: 220
Jim, you’re 6’11 and you weigh 90 pounds. Gumby has a better body than you. Boom, roasted. Dwight, you’re a kiss ass. Boom, roasted. Pam, you failed art school. Boom, roasted. Meredith, you’ve slept with so many guys, you’re starting to look like one. Boom, roasted. Kevin, I can’t decide between a fat joke and a dumb joke. Boom, roasted. Creed, your teeth called, your breath stinks. Boom, roasted.
a
Link 20 (Regular, uppercase)
p-subscript
Subscript 16 (regular, uppercase)
Subscript 16 (regular, uppercase)
Ordered list
BIGCITY GROTESQUE PRO
- Webflow is an innovative tool
- Webflow is an innovative tool
- Webflow is an innovative tool
- Webflow is an innovative tool
- Webflow is an innovative tool
Unordered list
BIGCITY GROTESQUE PRO
- Webflow is an innovative tool
- Webflow is an innovative tool
- Webflow is an innovative tool
- Webflow is an innovative tool
- Webflow is an innovative tool
02
Colors
black
#000000
White
#FFFFFFF
green
#005745
04
Cookies
04
Form
GRid system
Elements
Container
Elements
Row
Elements
Col
Grid
Desktop
Grid
Tablet & Landscape & Mobile
Grid
Margin 1/2 col
Grid
Direction vertical
Grid
Direction horizontal
Grid
Align start
Grid
Align center
Grid
Align end
Grid
Align stretch
Grid
Justify start
Grid
Justify center
Grid
Justify end
Grid
Justify between
Grid
Justify around
Grid
No offset
Grid
Display