Style Guide

This style guide provides a central location to make stylistic changes to your site. If you need additional help, Webflow University provides a library of videos, tutorials and resources to help you get started.

Colors

Primary Colors

Primary 1

#03233b

Accent Colors

Accent 1

#f6f8fb

Accent 2

#d1edf5

Accent 3

DBF1F7

Accent 5

#ffffff

Typography

This is a Heading

Heading 1 - 70px

This is a Heading

Heading 2 - 45px

This is a Heading

Heading 3 - 30px

This is a Heading

Heading 4 - 20px

This is a Heading

Heading 5 - 18px

This is a Heading

Heading 6 - 14px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales sapien, in tempus lectus lorem quis est.

Paragraph small - 14px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales sapien, in tempus lectus lorem quis est.

Paragraph normal - 18px

Bold - Lorem ipsum dolor sit amet

text bold - 18px

Italic - Lorem ipsum dolor sit amet

text italic - 18px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales sapien, in tempus lectus lorem quis est.

block quote

  • Lorem ipsum dolor sit amet consectetur.
  • Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales.
  • Sapien in tempus lectus lorem quis est.

Bullet list

  1. Lorem ipsum dolor sit amet consectetur.
  2. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales.
  3. Sapien in tempus lectus lorem quis est.

numbered list

Forms

Contact form

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

property inquiry form

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Newsletter form

Rich Text

This is Heading 1

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.

Lorem Ipsum dolor sim amet

This is Heading 2

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.

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  2. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales.
  3. Sapien in tempus lectus lorem quis est.

This is Heading 3

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.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales sapien, in tempus lectus lorem quis est.

This is Heading 4

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.

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales.
  • Sapien in tempus lectus lorem quis est.
This is Heading 5

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.

This is Heading 6

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.

Buttons

button

Primary button

Button

secondary button