Typography Guide

With Utility Styles

Heading 1

At nec ferri signiferumque. Sit no vocent detracto corrumpit, dolor sensibus sed ex. Sit esse aperiam virtute no. Ea cum dicta alienum, repudiare pertinacia liberavisse nec cu.

Heading 2

Pro stet propriae ullamcorper cu. Ea eam sale delectus officiis, cu petentium efficiantur pri. Ex mel velit maiorum pertinax. Eu his senserit suavitate. Cu putent intellegat mea, id omnesque facilisis eum. Vix splendide inciderint ne.

Heading 3

Ex aliquid maluisset vim, pro ea hinc dolorem intellegam. Cu nam intellegat comprehensam, ad epicuri oporteat mel. Ei ferri corpora nam, probo homero hendrerit ei his.

Heading 4

Vidisse salutandi gloriatur vim at, melius vidisse forensibus usu ex. Usu eros nostrud dolorum ea, id omnis detracto nec. Est tale mazim mentitum te. Soluta vocibus epicuri at usu.

blockquote

Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

Even better philosophical quote marked up with just a <blockquote> element.

ordered list

  1. list item 1
  2. list item 1
    1. list item 2
    2. list item 2
      1. list item 3
      2. list item 3
    3. list item 2
    4. list item 2
  3. list item 1
  4. list item 1

unordered list

  • list item 1
  • list item 1
    • list item 2
    • list item 2
      • list item 3
      • list item 3
    • list item 2
    • list item 2
  • list item 1
  • list item 1

description list

Description name
Description value
Description name
Description value
Description value
Description name
Description name
Description value

Tables

Table Heading Table Heading Table Heading Table Heading
Table Data Table Data Table Data Table Data
Table Data Table Data Table Data Table Data
Table Data Table Data Table Data Table Data

This paragraph uses the .dim10 class

This paragraph uses the .dim20 class

This paragraph uses the .dim30 class

This paragraph uses the .dim40 class

This paragraph uses the .dim50 class

This paragraph uses the .dim60 class

This paragraph uses the .dim70 class

This paragraph uses the .dim80 class

This paragraph uses the .dim90 class

This paragraph uses the .bgdim10 class

This paragraph uses the .bgdim20 class

This paragraph uses the .bgdim30 class

This paragraph uses the .bgdim40 class

This paragraph uses the .bgdim50 class

This paragraph uses the .bgdim60 class

This paragraph uses the .bgdim70 class

This paragraph uses the .bgdim80 class

This paragraph uses the .bgdim90 class