Style Guide
Color PaletteButtonsHeadingsParagraphsRich TextRich Text: PostRich Text: Work
Back to Homepage

Color Palette

Primary

Blue 1
#398ccB
Blue 1
#398ccB
Grey 1
#444444
Grey 2
#888888
Grey 3
#d1d1d1
Grey 4
#e9e9e9

Buttons

Button
Color Button
Button
Ghost Button
Button
Color Button + Icon
Button
White Button
Button
Ghost Button on Dark BG
Button
White Button + Icon

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Blue Text

Orange Text

Blue Text

Paragraph - Big

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.

Paragraph - Default

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.

Paragraph - Small

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.

Rich Text

Writing result-oriented ad copy is difficult, as it must appeal to, entice, and convince consumers to take action. A successful marketing plan relies heavily on the pulling-power of advertising copy. There is no magic formula to write perfect ad copy; it is based on a number of factors, including ad placement, demographic, even the consumer’s mood when they see your ad.

Introducing Maker. Powerful UI Kit Template for Startups

So how is any writer supposed to pen a stunning piece of advertising copy — copy that sizzles and sells? The following tips will jumpstart your creative thinking and help you write a better ad. Consumers are inundated with ads, so it’s vital that your ad catches the eye and immediately grabs interest.

Photo from Unsplash

You could do this with a headline or slogan (such as VW’s “Drivers Wanted” campaign), color or layout (Target’s new colorful, simple ads are a testimony to this) or illustration (such as the Red Bull characters or Zoloft’s depressed ball and his ladybug friend).  All good advertising copy is comprised of the same basic elements.

Simple & Beautiful

How you write your advertising copy will be based on where you will place your ad. If it’s a billboard ad, you’ll need a super catchy headline and simple design due to the speed at which people will pass. Online ads are similar; consumers are so inundated with Internet advertising that your ad must be quick and catchy.

"Writing result-oriented ad copy is difficult, as it must appeal to, entice, and convince consumers to take action. There is no magic formula to write perfect ad copy."

What would the consumer gain by using your product or service? This could be tangible, like a free gift; prestige, power or fame. But remember: you must be able to make good on that promise, so don’t offer anything unreasonable.

Template Features:
  • Beautifully Designed
  • Fully Responsive
  • CMS Content
  • Smooth Interactions

Magazine advertising is the most versatile, but this is solely dependent on the size of your ad and how many other ads compete with yours.

A Perfect Template for Your Startup

Grabbing the consumer’s attention isn’t enough; you have to keep that attention for at least a few seconds. This is where your benefits come into play or a product description that sets your offer apart from the others.

TEMPLATE FEATURES:
  1. Beautifully Designed
  2. Fully Responsive
  3. CMS Content
  4. Smooth Interactions

If you have a full page ad, feel free to experiment; more page space gives you more creative space. If the ad is tiny, you’ll need to keep things as simple as possible

Rich Text: Blog Post

Writing result-oriented ad copy is difficult, as it must appeal to, entice, and convince consumers to take action. A successful marketing plan relies heavily on the pulling-power of advertising copy. There is no magic formula to write perfect ad copy; it is based on a number of factors, including ad placement, demographic, even the consumer’s mood when they see your ad.

A Powerful UI Kit Template for Your Business.

So how is any writer supposed to pen a stunning piece of advertising copy — copy that sizzles and sells? The following tips will jumpstart your creative thinking and help you write a better ad. Consumers are inundated with ads, so it’s vital that your ad catches the eye and immediately grabs interest.

Free photo from Unsplash

You could do this with a headline or slogan (such as VW’s “Drivers Wanted” campaign), color or layout (Target’s new colorful, simple ads are a testimony to this) or illustration (such as the Red Bull characters or Zoloft’s depressed ball and his ladybug friend).  All good advertising copy is comprised of the same basic elements.

Simple & Beautiful

How you write your advertising copy will be based on where you will place your ad. If it’s a billboard ad, you’ll need a super catchy headline and simple design due to the speed at which people will pass. Online ads are similar; consumers are so inundated with Internet advertising that your ad must be quick and catchy.

Writing result-oriented ad copy is difficult, as it must appeal to, entice, and convince consumers to take action. There is no magic formula to write perfect ad copy.

What would the consumer gain by using your product or service? This could be tangible, like a free gift; prestige, power or fame. But remember: you must be able to make good on that promise, so don’t offer anything unreasonable.

Template Features:
  • Beautifully Designed
  • Fully Responsive
  • CMS Content
  • Smooth Interactions

Magazine advertising is the most versatile, but this is solely dependent on the size of your ad and how many other ads compete with yours.

A Perfect Template for Your Startup

Grabbing the consumer’s attention isn’t enough; you have to keep that attention for at least a few seconds. This is where your benefits come into play or a product description that sets your offer apart from the others.

TEMPLATE FEATURES:
  1. Beautifully Designed
  2. Fully Responsive
  3. CMS Content
  4. Smooth Interactions

If you have a full page ad, feel free to experiment; more page space gives you more creative space. If the ad is tiny, you’ll need to keep things as simple as possible.

Rich Text: Work Presentation

Writing result-oriented ad copy is difficult, as it must appeal to, entice, and convince consumers to take action. A successful marketing plan relies heavily on the pulling-power of advertising copy.

Free photo from Unsplash

There is no magic formula to write perfect ad copy; it is based on a number of factors, including ad placement, demographic, even the consumer’s mood when they see your ad.

A Powerful UI Kit Template for Your Business.

So how is any writer supposed to pen a stunning piece of advertising copy — copy that sizzles and sells? The following tips will jumpstart your creative thinking and help you write a better ad. Consumers are inundated with ads, so it’s vital that your ad catches the eye and immediately grabs interest.

Simple & Beautiful

How you write your advertising copy will be based on where you will place your ad. If it’s a billboard ad, you’ll need a super catchy headline and simple design due to the speed at which people will pass. Online ads are similar; consumers are so inundated with Internet advertising that your ad must be quick and catchy.

Writing result-oriented ad copy is difficult, as it must appeal to, entice, and convince consumers to take action. There is no magic formula to write perfect ad copy.

What would the consumer gain by using your product or service? This could be tangible, like a free gift; prestige, power or fame. But remember: you must be able to make good on that promise, so don’t offer anything unreasonable.

Template Features:
  • Beautifully Designed
  • Fully Responsive
  • CMS Content
  • Smooth Interactions

Magazine advertising is the most versatile, but this is solely dependent on the size of your ad and how many other ads compete with yours.

A Perfect Template for Your Startup

Grabbing the consumer’s attention isn’t enough; you have to keep that attention for at least a few seconds. This is where your benefits come into play or a product description that sets your offer apart from the others.

TEMPLATE FEATURES:
  1. Beautifully Designed
  2. Fully Responsive
  3. CMS Content
  4. Smooth Interactions

If you have a full page ad, feel free to experiment; more page space gives you more creative space. If the ad is tiny, you’ll need to keep things as simple as possible.

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 600
Gray 300
Gray 100
primary 900
primary 800
primary 600
primary 300
primary 100
Darker 900
Darker 800
Darker 600
Darker 300
Darker 100
yellow 900
yellow 800
yellow 600
yellow 300
yellow 100
RED 900
RED 800
RED 600
RED 300
RED 100
Blue 900
Blue 800
Blue 600
Blue 300
Blue 100

Typography

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

H1 / Hero Title
Size: 72px

The quick brown fox jumps over the lazy dog

H1 / H1 Title
Size: 64px

The quick brown fox jumps over the lazy dog

H2 / H2 Title
Size: 48px

The quick brown fox jumps over the lazy dog

H3 / H3 Title
Size: 40px

The quick brown fox jumps over the lazy dog

H4 / H4 Title
Size: 40px

The quick brown fox jumps over the lazy dog

H5 / H5 Title
Size: 32px
The quick brown fox jumps over the lazy dog
H6 / H6 Title
Size: 18px
The quick brown fox jumps over the lazy dog
Title
16px Font Size

Aa Bb Cc Dd

Body Large / Normal
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.

Body Large / Bold
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.

Body / Normal
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.

Body / Bold
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.

Body Small / Normal
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

Rich Text Field

For additional information, please visit the Webflow University

What’s a Rich Text element?

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.

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.

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.

  • Work closely with our outreach team on various SEO campaigns
  • Maintain website’s SEO health
  • Perform keyword research including discovery and expansion of keyword opportunities
  • Track keywords’ rankings, and report and analyze website analytics
  • Research and analyze competitor sites
  • Stay up to date with all SEO and content marketing trends
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.

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.