Webflow Style Guide
Welcome to the style guide of this webflow template. This guide offers comprehensive instructions on various design elements, ranging from color schemes and typography to button styles and text sizes.
This is designed to provide you with guidelines and best practices for creating a professional and impactful website for your business. It covers a wide range of web design aspects, including typography, color usage, imagery selection, layout considerations, and content strategies. By adhering to these guidelines, you can maintain consistency, enhance visual appeal, and ensure seamless navigation throughout your website.
Colours
Primary Colours
Secondary Colours
Other Colours
Typography
Heading H1
Heading H2
Heading H3
Heading H4
Heading H5
Heading H6
Rich Text - Blog Posts
Rich text blocks (RTBs) are different from regular paragraph and text elements. RTBs allow you to format headings, paragraphs, quotes, images, videos, captions, and lists all within the one element.
RTBs are what will be used for the primary body of your blog posts.
orem 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.
This is a H2 heading
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.
This is a H3 heading
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.
This is a H4 heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
This is a H5 heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
This is a H6 heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
This is an ordered list -
- Fully responsive
- Cloneable
- Swap in with your client's styles
This an unordered list -
- Fully responsive
- Cloneable
- Swap in with your client's styles
Below is what block quotes will look like in your blog posts -
"Lorem ipsum dolor sit amet, consectetur adipiscing elit."
