BannerBanner

Style guide

Headings Examples:

Heading style 1 Examples.

This is heading h1 with heading style1

This is heading h2 with heading style1

This is heading h3 with heading style1

This is heading h4 with heading style1

This is heading h5 with heading style1
This is heading h6 with heading style1

Heading style 2 Examples.

This is heading h1 with heading style2

This is heading h2 with heading style2

This is heading h3 with heading style2

This is heading h4 with heading style2

This is heading h5 with heading style2
This is heading h6 with heading style2

Heading style 3 Examples.

This is heading h1 with heading style3

This is heading h2 with heading style3

This is heading h3 with heading style3

This is heading h4 with heading style3

This is heading h5 with heading style3
This is heading h6 with heading style3

Title widget 1

Title

Title widget 2

Title
Title

Heading with line (you can add line to any heading type just use class="line-heading".).

lorem ipsum

lorem ipsum

lorem ipsum


Paragraph Examples:

Paragraph style 1 which will be the default body copy.

Paragraph xxl size.

Paragraph xl size.

Paragraph l size.

Paragraph default body text size.

Paragraph s size.

Paragraph xs size.

Paragraph style 2 which will be second font style.

Paragraph style 2 xl size.

Paragraph style 2 l size.

Paragraph style 2 default size.

Paragraph style 2 s size.

Paragraph style 2 xs size.


Italic fonts Examples:

Italic style of any font.

Hello this is italic style of defauly fonts. (just use class="italic")

Italic style with special font family.

Hello this is italic style with special font family. (just use class="italic-fonts")


Buttons Examples:

Button style 1

Lorem Ipsum

Button style 2

Lorem Ipsum

Button style 3

Lorem Ipsum

Links Examples:

Default link (anchor) style:

Hello this is a link.

Link style 2 example:

Lorem Ipsum


Colors Examples:

Color 1 or default site color. use no class or class="color-one".

Color 2 example. use class="color-two"

Color 3 example. use class="color-three"

Color 4 example. use class="color-four"

Color white example. use class="color-white"


Case Examples:

This is uppercase.

This is lowercase.

This is normal case.