StartX - Styleguide
All visual elements in this template are available for both personal and commercial projects. Please review the license terms for each asset before use.
Colors
This is used as an overview to be able to visually see the current text styles and sizes. After changing the fonts, feel free to manually update the font name and settings, such as size and line spacing.
Text colors
Black
#262626
Dark Grey
#707070
Light Grey
#DCD9D6
Accent colors
Accent One
#121431
Accent One Dark
#1D174E
Accent Two
#121431
Accent Two Dark
#121431
Background colors
Beige
#F2EEE9
Milky Beige
#F7F3ED
Milky White
#FFFBF5
White
#FFFFFF
Typography
This is used as an overview to be able to visually see the current text styles and sizes. After changing the fonts, feel free to manually update the font name and settings, such as size and line spacing.
Titles
H1 XL - Lora, Regular, 60px, 120%
H1 - Lora, Regular, 54px, 120%
H2 - Lora, Regular, 48px, 120%
H2 Small - Lora, Regular, 40px, 120%
H3 - Lora, Regular, 32px, 120%
H4 - Figtree, Medium, 24px, 120%
H5 - Figtree, Medium, 22px, 120%
H6 - Figtree, Medium, 20px, 120%
Body text
Body XL - Figtree, Regular, 26px, 140%
Body L - Figtree, Regular, 18px, 140%
Body M - Figtree, Regular, 16px, 140%
Body S - Figtree, Regular, 14px, 140%
Button - Figtree, Semibold, 16px, 120%
Licensing
All visual elements in this template are available for both personal and commercial projects. Please review the license terms for each asset before use.
Guides and spacing
Grid for Main Desktop viewport (>1200 px width)
Spacing for Tablet viewport (810-1199 px width)
1224px Total width / 12x 80px wide columns with 24px Spacing
Spacing for Mobile viewport (<810 px width)
1224px Total width / 12x 80px wide columns with 24px Spacing
