Typography


[ux_banner height=”400px” bg=”25″ bg_overlay=”rgba(0, 0, 0, 0.66)”]

[text_box]

Text Elements

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

[/text_box]

[/ux_banner]
[section bg_color=”rgb(255, 255, 255)”]

[title style=”center” text=”Typography”]

[row]

[col span=”3″]

Headline h1

Headline h2

Headline h3

Headline h4

Headline h5
Headline h6

[/col]
[col span=”3″]

headline h1

headline h2

headline h3

headline H4

headline H5
headline H6

[/col]
[col span=”3″]

primary color

secondary color

alert color

SUCCESS COLOR

DEFAULT COLOR

[/col]
[col span=”3″]

Default link
Bold link

Bold text
Italic text
Strikethrough
Underline

[/col]

[/row]
[row]

[col span=”4″]

Lead paragraph. dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

[/col]
[col span=”4″]

Bold Text. sit amet, consectetuer italic text  elit, sed diam nonummy nibh euismod tincidunt ut laoreet underline text magna aliquam erat volutpat. Strike throught. ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea. A simple link.

[/col]
[col span=”4″]

Normal Paragraph. sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequa

[/col]
[col span=”3″]

Default font

Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

[/col]
[col span=”3″]

Alternative Font.

Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

[/col]
[col span=”3″]

Thin text

Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

[/col]
[col span=”3″]

UPPERCASE

Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

[/col]
[col span=”6″]

This is a Fancy Text Underline

Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

[/col]
[col span=”6″]

This a count up number 5000

Count up number can be added anywhere.

[/col]

[/row]

[/section]
[section label=”Media Right” bg_color=”rgb(193, 193, 193)” bg_overlay=”rgba(255, 255, 255, 0.85)”]

[row style=”large” v_align=”middle”]

[col span=”6″ span__sm=”12″ align=”left”]

Flatsome Tip

You can find many text options in the “Format” dropdown in text editor.

You see the changes live if you use the Page Builder

[/col]
[col span=”6″ span__sm=”12″]

[ux_image id=”24″ depth=”3″]

[/col]

[/row]

[/section]
[section bg_color=”rgb(255, 255, 255)” bg_overlay=”rgb(34, 34, 34)” dark=”true” padding=”60px”]

[title style=”center” text=”Typography on Dark background”]

[row]

[col span=”3″]

Headline h1

Headline h2

Headline h3

Headline h4

Headline h5
Headline h6

[/col]
[col span=”3″]

headline h1

headline h2

headline h3

headline H4

headline H5
headline H6

[/col]
[col span=”3″]

primary color

secondary color

alert color

SUCCESS COLOR

DEFAULT COLOR

[/col]
[col span=”3″]

Default link
Bold link

Bold text
Italic text
Strikethrough
Underline

[/col]

[/row]
[row]

[col span=”4″]

Lead paragraph. dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

[/col]
[col span=”4″]

Bold Text. sit amet, consectetuer italic text  elit, sed diam nonummy nibh euismod tincidunt ut laoreet underline text magna aliquam erat volutpat. Strike throught. ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea. A simple link.

[/col]
[col span=”4″]

Normal Paragraph. sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequa

[/col]
[col span=”7″]

This is a Fancy Text Underline

Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

[/col]
[col span=”5″]

This a count up number 5000

Count up number can be added anywhere.

[/col]

[/row]

[/section]
[section padding=”60px”]

[title style=”center” text=”Quote”]

[row]

[col]

Quote. dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Normal Paragraph. sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequa. Horizontal Line:

[title style=”center” text=”Lists”]

[/col]
[col span=”2″]

  • Simple List
  • List item 1
  • List Item 2
  • List item 3
  • List Item 4
  • List Item 5

[/col]
[col span=”2″]

  1. Numbered List
  2. List item 1
  3. List Item 2
  4. List item 3
  5. List Item 4
  6. List Item 5

[/col]
[col span=”2″]

  • Checkmark list
  • List Item 2
  • List item 3
  • List Item 4
  • List Item 5

[/col]
[col span=”2″]

  • Star list
  • List Item 2
  • List item 3
  • List Item 4
  • List Item 5

[/col]
[col span=”2″]

  • Arrow List
  • List Item 2
  • List item 3
  • List Item 4
  • List Item 5

[/col]

[/row]

[/section]