How To /

Content Styles

This page shows the basic styles of our typography. it is also an easy reference to understand heading hierarchy and its relation to body copy.

Pre-Title Style Sub-Header

H1: Main title on the page

Paragraph with “intro” style applied, for optional, larger intro type copy. Should only be a few lines long, and let the reader know what they’re about to get into.

H2: Title used for New Sections

Paragraph with Intro Text style applied looks like this. An optional style often used highlight the first paragraph of text in a block. Should only be a few lines long, and is often followed by a normal paragraph or bulleted list.

Example paragraph text style. This is what your standard paragraphs will look like throughout the entire site. Certain areas may have special styles, but this is your standard copy size. Paragraph links are styled like this so that they are easy for users to find. You also have the ability to BOLD text as well as italic text. You can also insert links to download things in your content, ‘Example Document Title’ (PDF), like this.

Below this paragraph you’ll find examples of all the other styles you’ll have at your disposal. You also have a technical style guide page that lists all important information on image sizes, fonts, and colors.

On this page you’ll find examples of all the styles you’ll have at your disposal. Once your site is complete, you’ll also have a technical page that lists all important information on image sizes, fonts, and colors. 

  • This is a bulleted list created in a text editor widget.
  • You can also do a numbered list (bullets will change to numbers).
  • You can also create lists inside of a list.
    • Just like this!
  • We highly encourage the use of lists to make your content easier for the user to scan and digest quickly.
  • Most users on the web are task-oriented, so the easier the better.
  • Long paragraphs can be cumbersome and intimidating. Write for the web!
  1. This is a numbered list.
  2. You can also create lists inside of a list.
    1. Just like this!
  3. We highly encourage the use of lists to make your content easier for the user to scan and digest quickly.
  4. Most users on the web are task-oriented, so the easier the better.
  5. Long paragraphs can be cumbersome and intimidating. Write for the web!

Block Quote

“Paragraph with Intro Text style applied looks like this. An optional style often used highlight the first paragraph of text in a block. Should only be a few lines long to allow scanning and build trust with the visitors of this site.”

– Author Name – Title, Company Name

H3: Title used for Sub-Sections

It’s important to also mention that this is just a reference page. We would never encourage you to use all of these styles on one page, all at once. Rather, this is your guide to all things possible. This page is your point of reference for all the tools in your tool-box. 

H4: Title used for smaller supportive elements

H5: Title used for smaller supportive elements
H6: Title used for smaller supportive elements

Pre-Title Style Sub-Header

H1: Main title on the page

Paragraph with “intro” style applied, for optional, larger intro type copy. Should only be a few lines long, and let the reader know what they’re about to get into.

H2: Title used for New Sections

Paragraph with Intro Text style applied looks like this. An optional style often used highlight the first paragraph of text in a block. Should only be a few lines long, and is often followed by a normal paragraph or bulleted list.

Example paragraph text style. This is what your standard paragraphs will look like throughout the entire site. Certain areas may have special styles, but this is your standard copy size. Paragraph links are styled like this so that they are easy for users to find. You also have the ability to BOLD text as well as italic text. You can also insert links to download things in your content, ‘Example Document Title’ (PDF), like this.

Below this paragraph you’ll find examples of all the other styles you’ll have at your disposal. You also have a technical style guide page that lists all important information on image sizes, fonts, and colors.

On this page you’ll find examples of all the styles you’ll have at your disposal. Once your site is complete, you’ll also have a technical page that lists all important information on image sizes, fonts, and colors. 

  • This is a bulleted list created in a text editor widget.
  • You can also do a numbered list (bullets will change to numbers).
  • You can also create lists inside of a list.
    • Just like this!
  • We highly encourage the use of lists to make your content easier for the user to scan and digest quickly.
  • Most users on the web are task-oriented, so the easier the better.
  • Long paragraphs can be cumbersome and intimidating. Write for the web!
  1. This is a numbered list.
  2. You can also create lists inside of a list.
    1. Just like this!
  3. We highly encourage the use of lists to make your content easier for the user to scan and digest quickly.
  4. Most users on the web are task-oriented, so the easier the better.
  5. Long paragraphs can be cumbersome and intimidating. Write for the web!
Block Quote

“Paragraph with Intro Text style applied looks like this. An optional style often used highlight the first paragraph of text in a block. Should only be a few lines long to allow scanning and build trust with the visitors of this site.”

– Author Name – Title, Company Name

H3: Title used for Sub-Sections

It’s important to also mention that this is just a reference page. We would never encourage you to use all of these styles on one page, all at once. Rather, this is your guide to all things possible. This page is your point of reference for all the tools in your tool-box. 

H4: Title used for smaller supportive elements

H5: Title used for smaller supportive elements
H6: Title used for smaller supportive elements