Typography

Easiest way to make your content beautiful.

Headings

All HTML headings, <h1> through <h6>, are available.

h1. Bootstrap heading 22px

h2. Bootstrap heading 20px

h3. Bootstrap heading 18px

h4. Bootstrap heading 16px

h5. Bootstrap heading 14px
h6. Bootstrap heading 12px

Body Copy

This is applied to the <body> and all paragraphs.

Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla.

Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.

Lead Body Copy

Make a paragraph stand out by adding .lead

Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.

Inline text elements

Customize your text with predefined features.

Highlight

You can use the mark tag to highlight text.

Deleted text

This line of text is meant to be treated as deleted text.

Inserted text

This line of text is meant to be treated as an addition to the document.

Underlined text

This line of text will render as underlined

Small text

This line of text is meant to be treated as fine print.

Bold

This line of text is meant to be treated as fine print.

Underlined text

This line of text will render as underlined

Small text

This line of text is meant to be treated as fine print.

Bold & Italic

This line of text is meant to be treated as fine print.

Basic abbreviation

This line of text is meant to be attr

Initialism

This line of text is meant to be HTML

Transformation classes

Lowercased text.

Uppercased text.

Capitalized text.

Adresses

Present contact information for the nearest ancestor or the entire body of work. Preserve formatting by ending all lines with <br>.

Twitter, Inc.
1355 Market Street, Suite 900
San Francisco, CA 94103
P: (123) 456-7890
Full Name
first.last@example.com

Alignment Classes

Easily realign text to components with text alignment classes.

Left aligned text.

Center aligned text.

Right aligned text.

Justified text.

No wrap text.

Blockquotes

For quoting blocks of content from another source within your document.

Default blockquote

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Blockquote options

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title
Alternate displays

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Lists

All default and styled listings.

Unordered
  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Faucibus porta lacus fringilla vel
Ordered
  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Integer molestie lorem at massa
  4. Facilisis in pretium nisl aliquet
  5. Nulla volutpat aliquam velit
Unstyled
  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Faucibus porta lacus fringilla vel
Description
Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Horizontal description
Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.

Notifications

7 new, latest: July 19, 2016 at 10:14:32.

Product Delivered delivered

#SPW-955-18 to st. StreetName SA, USA.

19/07/2016 10:14:32 AM

Successful Payment success

Payment for order #SPW-955-17: $145.44.

19/07/2016 09:55:12 AM

New Order #SPW-955-17 waiting

Added new order, waiting for payment. Order details.

19/07/2016 09:51:55 AM

Money Back Request return

#SPW-955-17 return requested. Request details.

19/07/2016 08:44:51 AM

The critical amount of product important

Product: Extra Awesome Product (amount: 2). Storehouse.

19/07/2016 08:30:00 AM

Product Delivery Start delivering

#SPW-955-18 to st. StreetName SA, USA.

18/07/2016 06:14:32 PM

Critical Server Load server

Disk space: 248.1Gb/250Gb. Control panel.

18/07/2016 06:14:32 PM

Settings

Notification Settings