Colors

These colors have been created using Global Swatches. If you edit the Global Swatch color, it will change every element that uses that color swatch.

Primary

Primary 700
#006266
Primary 600
#008186
Primary 500
#009DA3
Primary 200
#DEE9DE
Primary 100
#F9FAF9

Secondary

Secondary 800
#8F6900
Secondary 500
#FFCD93
Secondary 300
#009DA3
Secondary 200
#F5EFE0

Neutral

Neutral 800
#213650
Neutral 600
#425F80
Neutral 400
#B5C7D9
White
#FFFFFF

Others

Blue 300
#D5E7F1
Blue 200
#E0EDF5
Purple 300
#DED5F1
Purple 200
#E7E0F5

Typography

You'll see that some typography elements don't have classes. That's because on this page, we want to edit the styles after selecting "All H1 Headings" for example, so that it will effect all the elements on the site. To do this, select the H1 below, click where it says "Select a Class or Tag" and select "All H1 Headings" at the bottom of the list.

All H1 Headings

Keep your face toward the sunshine and shadows will fall behind you

All H2 Headings

Keep your face toward the sunshine and shadows will fall behind you

All H3 Headings

Keep your face toward the sunshine and shadows will fall behind you

All H4 Headings

Keep your face toward the sunshine and shadows will fall behind you

All H5 Headings
Keep your face toward the sunshine and shadows will fall behind you
All H6 Headings
Keep your face toward the sunshine and shadows will fall behind you
Text Large
Donec in risus ac ipsum aliquam sodales vitae quis est suspendisse dignissim est sed mauris ultrices sagittis fusce pellentesque orci et mauris elementum condimentum nulla, commodo luctus nibh, eu finibus metus malesuada quis.
All Paragraphs

Donec in risus ac ipsum aliquam sodales vitae quis est suspendisse dignissim est sed mauris ultrices sagittis fusce pellentesque orci et mauris elementum condimentum nulla, commodo luctus nibh, eu finibus metus malesuada quis.

Text Small

Donec in risus ac ipsum aliquam sodales vitae quis est suspendisse dignissim est sed mauris ultrices sagittis fusce pellentesque orci et mauris elementum condimentum nulla, commodo luctus nibh, eu finibus metus malesuada quis.

Text Block
This is some text inside of a div block.
Block Quote
This is some a block quote
All Unordered Lists
  • Consist various constructs with varying degree of parallelism.
  • Although high performance in concurrent tasks.
  • Your tasks are a big part of life Stay always be motivated.
All Ordered Lists
  1. Consist various constructs with varying degree of parallelism.
  2. Although high performance in concurrent tasks.
  3. Your tasks are a big part of life Stay always be motivated.
All Links
Rich Text

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.

A rich text element (RTE) is the perfect element for creating long-form content like blog posts, about pages, biographies — you name it. Instead of adding individual heading, paragraph, list, or image elements, you can double-click into a rich text element to create these different content elements directly.

Styled example for Rich Text elements

When she reached the first hills of the Italic Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane. Pityful a rethoric question ran over her cheek, then she continued her way.

  • This however showed weasel
  • Well uncritical so misled
  • Goodness much until that fluid owl

According a funnily until pre-set or arrogant well cheerful

But nothing the copy said could convince her and so it didn’t take long until a few insidious Copy Writers ambushed her, made her drunk with Longe and Parole and dragged her into their agency, where they abused her for their projects again and again. And if she hasn’t been rewritten, then they are still using her.

"My vision is a world of healthy minds"

According a funnily until pre-set or arrogant well cheerful

  1. So baboon this
  2. Mounted militant weasel gregariously admonishingly straightly hey
  3. Dear foresaw hungry and much some overhung
  4. Rash opossum less because less some amid besides

When she reached the first hills of the Italic Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane. Pityful a rethoric question ran over her cheek, then she continued her way. On her way she met a copy.

Silent delightfully including because before one up barring chameleon

But nothing the copy said could convince her and so it didn’t take long until a few insidious Copy Writers ambushed her, made her drunk with Longe and Parole and dragged her into their agency, where they abused her for their projects again and again.

According a funnily until pre-set or arrogant well cheerful

But nothing the copy said could convince her and so it didn’t take long until a few insidious Copy Writers ambushed her, made her drunk with Longe and Parole and dragged her into their agency, where they abused her for their projects again and again.

Online therapist talking with clients on her smartphone.
This is a caption

Buttons

These are all the buttons that are used in this project. Editing them will reflect the changes on all the other buttons of the project too.

Button
Is Button Small
Primary Button
Button
Button Secondary
Secondary Button
Button
Is Button Small
Button Secondary
Secondary Button