H1:Quick brown fox jumped over the slow dog.

.h1 class, or typography XX-Large :Quick brown fox jumped over the slow dog.

.h2-large class. This is used only by manual addition of this css class. It’s for custom designed pages rather than normal content (like articles):Quick brown fox jumped over the slow dog.

H2: Quick brown fox jumped over the slow dog.

.h2 class, XL, or typography has-larger-font-size :Quick brown fox jumped over the slow dog.

H3: Quick brown fox jumped over the slow dog.

.h3 class, L, or typography large :Quick brown fox jumped over the slow dog.

H4: Quick brown fox jumped over the slow dog.

.h4 class, or typography medium :Quick brown fox jumped over the slow dog.

H5: Quick brown fox jumped over the slow dog.

.h5 class, or typography small :Quick brown fox jumped over the slow dog.

H6: Quick brown fox jumped over the slow dog. or var(–global-font-size-xsmall)

This is a paragraph of text. It should wrap correctly and show proper line spacing.
Quick brown fox jumped over the slow dog.
Body* – 16px, 1.4 (22.4) line-height, 2% letter-spacing

This is a paragraph of small text. It should wrap correctly and show proper line spacing.
Quick brown fox jumped over the slow dog.
Small body – 14px, 1.5 (21) line-height

This is bold text.

This is italic text.

This is underlined text.

This is strikethrough text.

This is a blockquote. It is often used for quoting text.

• Unordered List Item 1
• Unordered List Item 2
• Unordered List Item 3

1. Ordered List Item 1
2. Ordered List Item 2
3. Ordered List Item 3

<code>This is inline code</code>

This is preformatted text.
It preserves spaces and line breaks.

Table Header 1	Table Header 2
Table Cell 1	Table Cell 2
Table Cell 3	Table Cell 4

Text Input:

Textarea:

Button

SPACING COMPUTATIONS

This is a guide to how to use the pre-establishing spacing rules. These exist in order to keep an orderly sense of distance between objects, and for padding within them. All of the calculations behind the scenes are using relative units of REM, which is based on our basic typography font size unit of 16px. If a user dictates their preferred type size should be larger because of accessibility issues, then the rest of the site will scale with that.