Style Guide

Typography

  • Heading Font : Poppins
  • Button Font : Roboto
  • Body Font : Roboto

Heading 1

  • Font Size : 50px
  • Font Weight : Bold
  • Font Style : Normal
  • Line Height : 1em

Heading 2

  • Font Size : 35px
  • Font Weight : Bold
  • Font Style : Normal
  • Line Height : 1em

Heading 3

  • Font Size : 30px
  • Font Weight : Normal
  • Font Style : Normal
  • Line Height : 1em

Heading 4

  • Font Size : 20px
  • Font Weight : Bold
  • Font Style : Normal
  • Line Height : 1em
Heading 5
  • Font Size : 18px
  • Font Weight : Normal
  • Font Style : Normal
  • Line Height : 1em
Heading 6
  • Font Size : 16px
  • Font Weight : Normal
  • Font Style : Normal
  • Line Height : 1em

Site Width

  • Container: 1180px
  • Default Section Padding: 20px(right, left) Top and bottom padding depends Recommended Padding values: 0,10, 20,40,80,160
  • Default Column padding: 20px

Color pallete

Primary
#f40000
Secondary
#e4d9d3
Text
#1A1A1A
Accent
#daa503
Greyscale
#232020
#363839
#606060
#EDEDED

Buttons

Primary
Sample Button
  • Font Size : 16px
  • Font Weight : Normal
  • Font Style : Normal
  • Line Height : 1em
  • Background Color : #5aa0d7
  • Font Color : #ffffff
Secondary
Sample Button
  • Font Size : 16px
  • Font Weight : Normal
  • Font Style : Normal
  • Line Height : 1em
  • Background Color : #5aa0d7
  • Font Color : #ffffff

Paragraph

This is a sample sentence with a body font, Font Size of 18px, Line height of 1.8em, Normal Font Weight and Normal Font style. This is a sample link with a body font, Font Size of 18px, Line height of 1.8em, Normal Font Weight and Normal Font style.

This is a sample sentence with a body font, Font Size of 18px, Line height of 1.8em, Normal Font Weight and Normal Font style. This is a sample link with a body font, Font Size of 18px, Line height of 1.8em, Normal Font Weight and Normal Font style.

This second sentence is a sample of bold font.

 

This sentence is a sample of italic font.

 

This is a sample sentence with hyperlink.