Style Guide
This style guide page contains styles and components used through the website. You can change any style from this page and it will be updated throughout the site.
Typography
The different text sizes used throughout the site.
h1
I'm a New York based product designer.
h2
I'm a New York based product designer.
h3
I'm a New York based product designer.
h4
I'm a New York based product designer.
h5
New York based product designer
h6
New York based product designer
Large Paragraph
I'm currently working as a solo freelancing and open to any new projects or ideas you want to swing past me. If you have something in mind, send me an email.
Paragraph
I'm currently working as a solo freelancing and open to any new projects or ideas you want to swing past me. If you have something in mind, send me an email.
Small Paragraph
I'm currently working as a solo freelancing and open to any new projects or ideas you want to swing past me. If you have something in mind, send me an email.
Quote
I'm currently working as a solo freelancing and open to any new projects or ideas you want to swing past me. If you have something in mind, send me an email.
List
- Heading line height is fixed
- All buttons now have tooltips
- Spell checker number issue fixed
Figure with caption
Rich Text
I'm a New York based Illustrator.
Hi, I'm Jack Montreal. I'm a New York based product designer focused on creative user experiences that people love.
I'm currently working as a solo freelancing and open to any new projects or ideas you want to swing past me. If you have something in mind, send me an email.
Latest press
- Adobe Design Achievement
- Brand New
- Communication Arts
Colors
The different weights of greys and colours used throughout the website.
Buttons
The different buttons available to use across the website.
Columns
The 12 column grid system to make it easy to align sections across different screen sizes.
1 Col
2 Col
3 Col
4 Col
5 Col
6 Col
7 Col
8 Col
9 Col
10 Col
11 Col
Grids
Different grid layouts to use across your site
4 Grid
3 Grid
2 Grid
2-1 Grid
1-2 Grid
Spacers
Spacer elements using the 8-pt grid to give sections more room to breathe.
16 px
24 px
32 px
48 PX
64 PX
80 PX
96 PX
128 PX
Forms
The basic forms styles to be used for any froms across the website.
Tabs
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
© Developfolio. Powered by Webflow.