Style Guide

Sizes

s0

s0

s-1

s1

s-2

s2

s-3

s3

s-4

s4

s-5

s5

s-6

s6

s-7

s7

Fonts

Serif Font: "Helvetica Neue", Helvetica, sans-serif;

Serif Font italic: "Helvetica Neue", Helvetica, sans-serif;

Serif Font bold: "Helvetica Neue", Helvetica, sans-serif;

Serif Font: Georgia, serif;

Serif Font italic: Georgia, serif;

Serif Font italic: Georgia, serif;

Monospace Font: "Lucida Console", Monaco, monospace;

Headings

Heading Level 1

Heading Level 2

Heading Level 3

Heading Level 4

Heading Level 5

Heading Level 6

Paragraph

A paragraph (from the Greek paragraphos, to write beside or written beside) is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.

A paragraph (from the Greek paragraphos, to write beside or written beside) is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.

Aside

A paragraph (from the Greek paragraphos, “to write beside” or “written beside”) is a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.

Inline Elements

This is a text link (<a href="">)

This is a text link that has been hovered

Strong (<strong>) is used to indicate strong importance

This text has added emphasis (<em>)

This text is deleted (<del>) and This text is inserted (<ins>)

Superscript (<sup>) for things like: 4^th of August, or 5,490.35 km²

Subscript (<sub>) for things like: H₂O

This small text (<small>) for fine print, etc.

Abbreviation (<abbr>): HTML

This text has a short inline quotation (<q>)

This text has a short inline quotation with another short inline quotation inside

The dfn element (<dfn>) indicates a definition

The mark element (<mark>) indicates a highlight

This is what inline code (<code>) looks like

This is sample output (<samp>) from a computer program

The variable element (<var>), such as x = y

Keyboard input: cmd (<kbd>)

This is text that is selected by the user

Blockquote

A block quotation (also known as a long quotation or extract) is a quotation in a written document, that is set off from the main text as a paragraph, or block of text, and typically distinguished visually using indentation and a different typeface or smaller size quotation.

Quote Source with link

Lists

Unordered List

• This is a list item in an unordered list
• An unordered list is a list in which the sequence of items is not important. Sometimes, an unordered list is a bulleted list. And this is a long list item in an unordered list that can wrap onto a new line.
• Lists can be nested inside of each other
  • This is a nested list item
  • This is another nested list item in an unordered list
• This is the last list item

Ordered List

1. This is a list item in an ordered list
2. An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
3. Lists can be nested inside of each other
   1. This is a nested list item
   2. This is another nested list item in an ordered list
4. This is the last list item

Ordered List Reversed

1. This is a list item in an ordered list
2. An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
3. This is the last list item
   1. This is a nested list item
   2. This is another nested list item in an ordered list

Ordered List Reversed, Twice

1. This is a list item in an ordered list
2. An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
3. This is the last list item
   1. This is a nested list item
   2. This is another nested list item in an ordered list

Definition List

Definition List

A number of connected items or names written or printed consecutively, typically one below the other.

This is a term.

This is the definition of that term, which both live in a dl.

And another term.

And it gets a definition too, which is this line.

Tables

Table

Table with Alternating Rows

Table with Subheadings

Table with Subheadings and Alternating rows

Preformatted Text

P R E F O R M A T T E D T E X T
! " # $ % & ' ( ) * + , - . /
0 1 2 3 4 5 6 7 8 9 : ; < = > ?
@ A B C D E F G H I J K L M N O
P Q R S T U V W X Y Z [ \ ] ^ _
` a b c d e f g h i j k l m n o
p q r s t u v w x y z { | } ~

Forms

Buttons

Figure

Video