1. Home
  2. Style Guide
  3. Style Guide: Text Options

Style Guide: Text Options - Page Title - (H1 / 34px)

Level 1 Heading (H2 / 28px)

Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Level 2 Heading (H3 / 24px)

Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Level 3 Heading (H4 / 22px)

Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.


Additional Body Copy Options

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur.

List (H5/20px - WYSIWYG):

A) unordered list

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Nulla egestas accumsan tortor eget lacinia.
  • Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo.
    • Duis in cursus urna.
    • Maecenas pretium vel ligula eget efficitur.
    • Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar.
      • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      • Nulla egestas accumsan tortor eget lacinia.
      • Aliquam interdum, augue in egestas tempus

B) ordered list

  1. Duis in cursus urna.
  2. Maecenas pretium vel ligula eget efficitur.
  3. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar.
  4. Mauris tincidunt suscipit ipsum ac rhoncus.
    1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    2. Nulla egestas accumsan tortor eget lacinia.
    3. Aliquam interdum, augue in egestas tempus
      1. Duis in cursus urna.
      2. Maecenas pretium vel ligula eget efficitur.
      3. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar.
Table (H5/20px - WYSIWYG):
Title 1 Title 2 Title 3
Lorem ipsum Lorem ipsum Lorem ipsum
Title 1 Title 2 Title 3
Lorem ipsum Lorem ipsum Lorem ipsum

Column layout

2 Column (H5/20px - WYSIWYG):

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

3 Column (H5/20px - WYSIWYG):

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.


Icons (currently available)

  • Arrow Right arrow-right
  • Bar Chart bar-chart
  • Check Circle check-circle
  • Chevron Up chevron-up
  • Chevron Down chevron-down
  • Chevron Left chevron-left
  • Chevron Right chevron-right
  • Chrome chrome
  • Close close
  • Desktop desktop
  • Edge edge
  • Exclamation Circle exclamation-circle
  • File Search file-search
  • File Text O file-text-o
  • Firefox firefox
  • Instagram instagram
  • Internet Explorer internet-explorer
  • Linkedin linkedin
  • Lock lock
  • Newspaper newspaper
  • Safari safari
  • Search search
  • Shopping Cart shopping-cart
  • Times Circle times-circle
  • Twitter twitter
  • User user
  • Youtube youtube
  • Youtube Play youtube-play