Style Guide

Color Palette & Typefaces

Color Palette

Main Color - Background, Etc.
Coral
#F7DDCD

Secondary Color - Text & Elements
Coal
#0B0E10

Color 1
Coal
#0B0E10

Color 2
Seal
#36454F

Color 3
Umber
#7e3f18

Color 4
Coral
#F7DDCD

Color 5
French Grey
#898783

Color 6
Marble
#0B0E10

Typefaces

Both of the typefaces used are available on Google Fonts. You can find Playfair Display here, and Manrope here.

Playfair Display
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.
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz - 0123456789
Manrope
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.
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz - 0123456789

Text & UI Elements

Editing those text styles will also change styles across the whole site

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Paragraphs

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.

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.

Block Quote

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.

Lists

  1. Lorem ipsum sim dolor amet nec consegir
  2. Lorem ipsum sim dolor amet nec consegir
  3. Lorem ipsum sim dolor amet nec consegir

Buttons & Links

This is a text link
THIS IS A TEXT BUTTON
This is some text inside of a div block.

Heading

*Oval Button is only visible on previewed site due to the hover interaction on it