Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Heading classes

heading-xxlarge
heading-xlarge
heading-large
heading-medium
heading-small
heading-xsmall

Text size

text-size-xxlarge
text-size-xlarge
text-size-large
text-size-medium
text-size-normal
text-size-small
text-size-tiny

Text style

text-style-italic
text-style-allcaps
text-style-quote
text-style-strikethrough
text-style-muted
text-color-black
text-color-white
text-style-nowrap
text-style-2lines
text-style-3lines

Text weight

text-weight-xbold
text-weight-bold
text-weight-semibold
text-weight-medium
text-weight-normal
text-weight-light

Text alignment

text-align-left
text-align-center
text-align-right

Rich text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6
This is a block quote

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!

This is a link inside of a rich text

  • List item
  • List item
  • List item
Placeholder graphic
Image inside of a richtext

Colors

Black
#24292e
Grey
#f6f8fa
Whitesmoke
#fafbfc
Border
#e1e4e8
Blue
#0366d6
Blue hover
#1158c7
Success green
#28a745
Error red
#d73a49

Background classes

background-grey
background-whitesmoke

Forms

Awesome, you subscribed!
Error! Please try again.

Icon classes

Finsweet fs logo iconFinsweet fs logo iconFinsweet fs logo iconFinsweet fs logo icon

Icons 1x1

Finsweet fs logo iconFinsweet fs logo iconFinsweet fs logo iconFinsweet fs logo icon

Social icons

Container

container-large
container-medium
container-small

Max width

max-width-xxsmall
max-width-xsmall
max-width-small
max-width-medium
max-width-large
max-width-xlarge
max-width-xxlarge
max-width-full
max-width-full-tablet
max-width-full-mobile-wide
max-width-full-mobile

Margins

margin-0
margin-tiny
margin-xxsmall
margin-xsmall
margin-small
margin-medium
margin-large
margin-xlarge
margin-xxlarge
margin-huge
margin-xhuge
margin-xxhuge
margin-custom1
margin-custom2
margin-custom3
margin-top
margin-right
margin-bottom
margin-left
margin-horizontal
margin-vertical
margin-0-all

Paddings

padding-0
padding-tiny
padding-xxsmall
padding-xsmall
padding-small
padding-medium
padding-large
padding-xlarge
padding-xxlarge
padding-huge
padding-xhuge
padding-xxhuge
padding-custom1
padding-custom2
padding-custom3
padding-top
padding-right
padding-bottom
padding-left
padding-horizontal
padding-vertical
padding-0-all

Other global classes