Style Guide

Style guide page contains styles and components used through the template.
You can change any style or color from this page and it will be applied for the whole template.

HTML Headings

typography
heading 1

Heading one

heading 2

Heading two

heading 3

Heading three

heading 4

Heading four

heading 5
Heading five
heading 6
Heading six

Heading Classes

typography

Heading Style H1

Heading Style H2

Heading Style H3

Heading Style H4

Heading Style H5

Heading Style H6

HTML Classes

typography
all paragraph

The quick brown fox jumps over the lazy dog text design

all links
Text Link
all quotes
Block Quote
all lists

  • Unordered list

  • Unordered list

Text Classes

typography
Text Size Large

The quick brown fox jumps over the lazy dog text design

Text Size Medium

The quick brown fox jumps over the lazy dog text design

Text Size Small

The quick brown fox jumps over the lazy dog text design

Text Size XSmall

The quick brown fox jumps over the lazy dog text design

Text Style Allcaps

The quick brown fox jumps over the lazy dog text design

Text Weight Semibold

The quick brown fox jumps over the lazy dog text design

Text Align Left

The quick brown fox jumps over the lazy dog text design

Text Align Center

The quick brown fox jumps over the lazy dog text design

Text Align Right

The quick brown fox jumps over the lazy dog text design

Text Colors

colors
Text Color Grey
The quick brown fox jumps over the lazy dog text design
Text Color Gradient
The quick brown fox jumps over the lazy dog text design
Text Color White
The quick brown fox jumps over the lazy dog text design

Background Colors

colors
Background Color Black
Background Color Grey

Color Palette

colors
Grey 800
Grey 600
Grey 400
Grey 200
Grey 100
Primary 800
Primary 600
Primary 200

Buttons

components
Button
Button
Button
Secondary
Button
Button
Icon
Button ->
Button
Icon Color
Button ->
Button
White
Button

Form

components
form_component
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Rich Text

components
Rich Text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Sample text with a link is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text. Sample text is being used as a placeholder for real text. Sample text is being used as a placeholder for real text.

  • Sample text is being used as a placeholder for real text that is normally present.
  • Sample text is being used as a placeholder for real text that is normally present.
  • Sample text is being used as a placeholder for real text that is normally present.
  1. Sample text is being used as a placeholder for real text that is normally present.
  2. Sample text is being used as a placeholder for real text that is normally present.
  3. Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text that is normally present.

Icons

1x1
Icon Small
Icon Medium
Icon Large