Style Guide

All graphical assets in this template are licensed for personal and commercial use.
If you’d like to use a specific asset, please check the license below

STYLE GUIDE
Colors
Typography
UTILITY
Buttons
Rich Text Element
Note: Change the colors through the swatches panel. This will change all locations where the color is used on the website. You can learn more about global swatches on the Webflow University.
Gray 900
Gray 800
Gray 700
Gray 600
Gray 500
Gray 400
Gray 300
Gray 200
Gray 100
WHITE
red 900
red 600
red 300
red 100

Headings

Any edits here will apply to all reflective elements across the site.

H1 Heading
Size: 56px

The quick brown fox jumps over the lazy dog

H2 Heading
Size: 48px

The quick brown fox jumps over the lazy dog

H3 Heading
Size: 40px

The quick brown fox jumps over the lazy dog

H4 Heading
Size: 32px

The quick brown fox jumps over the lazy dog

H5 / H5 Title
Size: 24px
The quick brown fox jumps over the lazy dog

Sub Headings

Any edits here will apply to all reflective elements across the site.

Heading / Medium
Size: 18px
The quick brown fox jumps over the lazy dog
Heading / Normal
Size: 16px
The quick brown fox jumps over the lazy dog

Paragraph / Body

Any edits here will apply to all reflective elements across the site.

Paragraph / Large
18px Font Size

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

Paragraph / Regular
16px Font Size

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

Buttons

For additional information, please visit the Webflow University

Let's talk
Got a project?
Browse Articles
Let's talk.

Rich Text Field

For additional information, please visit the Webflow University

Lorem ipsum is simply dummy text.

Lorem ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

Lorem ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

Static and dynamic content editing

Lorem ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

  • • Example Feature Point
  • • Example Feature Point
  • • Example Feature Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus scelerisque nulla accumsan massa sollicitudin, quis sollicitudin odio accumsan. Nunc pulvinar, enim nec vestibulum sagittis.

The standard chunk

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus scelerisque nulla accumsan massa sollicitudin, quis sollicitudin odio accumsan. Nunc pulvinar, enim nec vestibulum sagittis, felis risus faucibus magna, vitae vulputate dui nisi ut nunc.