Style Guide

Global Heading tags

global-heading-h1
global-heading-h1

global-heading-h2
global-heading-h2

global-heading-h3
global-heading-h3

global-heading-h4
global-heading-h4

global-heading-h5
global-heading-h5
global-heading-h6
global-heading-h6
Heading Classes

heading-h1
heading-h1

heading-h2
heading-h2

heading-h3
heading-h3

heading-h4
heading-h4

heading-h5
heading-h5

heading-h6
heading-h6

Texts

Paragraph
‍Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni

Paragraph
‍Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni

text-size-p1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni

text-size-p2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-size-p3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-size-p4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-size-p5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-size-p6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-style-link
text-style-italic
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,
text-style-muted
text-style-strikethrough
text-style-allcaps
text-style-nowrap
text-style-quote
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-style-2lines
Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Suspendisse varius eni Lorem ipsum dolor sit amet,

text-style-3lines
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse varius eni Lorem ipsumdcsd
dcdccdscs
sdcsdc
dolor sit amet,

text weights
text-weight-light
text-weight-normal
text-weight-medium
text-weight-semibold
text-weight-bold
text-weight-xbold
text alignments
text-align-left
text-align-center
text-align-right
text colors
text-color-blue-100
text-color-blue-200
text-color-green-100
text-color-white
Rich Text

Heading1

Heading2

Heading3

Heading4

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.

  • Just double-click and easily create content.
  • Just double-click and easily create content.
  • Just double-click and easily create content.
  • Just double-click and easily create content.

This is a link

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!
Color Palatte
is--blue-100
is--blue-200
is--green-100
is--green-200
is--white-100
is--white-200
is--07
is--09
is--gradient-
03