Style Guide
An in-depth guide to mastering color, typography, layout, and other essential design elements
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Block quote
Ordered list
- Item 1
- Item 2
- Item 3
Unordered list
- Item A
- Item B
- Item C
Bold text
Emphasis
Superscript
Subscript
Colors
#c9b896
#6e5b3a
#fFFFFF
#f9f5f1
#6a6a6a
#2c2c2c
#060606
#e5e3df
#ababab
Typography
Heading 1
H1 - 90px /120% || Regular || Inter Tight
Heading 2
H2 - 64px /130% || Regular || Inter Tight
Heading 3
H3 - 36px /120% || Regular || Inter Tight
Heading 4
H3 - 28px /130% || Regular || Inter Tight
Heading 5
H3 - 24px /130% || Regular || Inter Tight
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Default Paragraph - 18px /150% || Regular || Satoshi
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Large Paragraph - 20px /120% || Regular || Satoshi
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Medium Paragraph - 16px /150% || Regular || Satoshi
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Small Paragraph - 14px /140% || Regular || Satoshi
“Embrace each moment with courage and determination, for it is through challenges that we grow. Remember, success is not measured by the absence of obstacles, but by the strength to overcome them.”
Icons
