—Styleguide

Style Guide page contains styles that are used the most throughout this template.

HTML heading tags

Heading H1

Heading H2

Heading H3

Heading H4

Heading H5
Heading H6
Heading classes

Heading Xlarge

Heading Large

Heading Medium

Heading Small

heading-xsmall

HTML text tags

All Paragraphs (HTML-TAG)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni

All Links (HTML-TAG)All Links (HTML-TAG)
All Quotes (HTML-TAG)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet
Text sizes

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

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

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

P4 Small
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet

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

Text weights
P1 Semibold
P1 Underline
P2 Semibold
P2 Underline
P3 Bold
P3 Underline
P4 Semibold
P4 Small
P4 Underline
P5 Bold
P5 Semibold
P5 Underline
Text styles

Text Style Strikethrough

Text Style Italic

Text Style Muted
text style allcaps
Text Style Nowrap
Text Style Link
Text Style Quote:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius eni Lorem ipsum dolor sit amet,
Text alignments
Text Align Left
Text Align Center
Text Align Right
Rich text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

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.

  • The rich text element allows you to create and format headings,
  • The rich text element allows you to create and format headings,
  • The rich text element allows you to create and format headings,

This is a link

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.
Placeholder
This is a placeholder image.

Heading 2

Colors

Brand Palette

Default
#111111
Accent 1
#F9F7F2
Accent 2
#A5AEA7
Accent 3
#96013C
Colors

Text Colours

Default
#111111
White
#FFFFFF
Disabled
#A2A1A0
Accent
#96013C
Colors

CTA

Default
#111111
Hover
#A5AEA7
Disabled
#DAD9D8
Colors

Forms

Field BG
#FFFFFF
Success
#116B51
Warning
#CF8A36
Error
#C1053F
Backgrounds
Buttons
Secondary button
UI Icons 12px
UI Icons 16px
UI Icons 24px
UI Icons 48px
Webflow elements

List

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

Form

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