Documentation

Style guide

Color

Use colors to customize this template to match your brand identity.

Learn more about how to manage color swatches & variables in Webflow.

Aa
Brand 01
Aa
Brand 02
Aa
Neutral 01
Aa
Neutral 02
Aa
Neutral 03
Aa
Neutral 04
Aa
Neutral 05
Aa
Neutral 06
Aa
Neutral 07
Aa
Base Light
Aa
Base Dark

Display

Use Display classes when typography style doesn't match the default HTML tag.

Display Heading 2XL
Lorem ipsum
Display Heading XL
Lorem ipsum
Display Heading LG
Lorem ipsum
Display Heading MD
Lorem ipsum
Display Heading SM
Lorem ipsum
Display Heading XS
Lorem ipsum
Display Body XL
Lorem ipsum
Display Body LG
Lorem ipsum
Display Body MD
Lorem ipsum
Display Body SM
Lorem ipsum
Display Body XS
Lorem ipsum
Display Body 2XS
Lorem ipsum

Heading

Use HTML tags to define default Heading styles and guide people and search engines through your content.

Learn more about how to use headings in Webflow.

H1

Lorem ipsum

H2

Lorem ipsum

H3

Lorem ipsum

H4

Lorem ipsum

H5
Lorem ipsum
H6
Lorem ipsum

Tag

HTML tags define default text styles.

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.

Block Quotes
"Lorem ipsum"
Unordered Lists
  • Lorem ipsum

  • Lorem ipsum

  • Lorem ipsum

Ordered Lists
  1. Lorem ipsum

  2. Lorem ipsum

  3. Lorem ipsum

Richtext

Use Rich Text to create long-form content.

Learn more about how to use rich text in Webflow.
Learn more about how to use headings in Webflow.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

This is a block quote

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

This is a link inside of a rich text

  • List item
  • List item
  • List item

  1. List item
  2. List item
  3. List item

Image caption
arrow_outward