This page content is intended for test purposes only for determining if the type scales are configured correctly according to the design.

For an example, see https://type-scale.com/

Quick Links:

• Headings & Body Fonts
• List Items
• Quotes
• Tables

Here’s just an example of the spacing between a paragraph and an eyebrow.

Eyebrows are Styled like this

Heading 2 with Eyebrow

Large body font would look like this. lorem ipsum dolor sit amet, consectetur adipiscing elit.

Normal body font looks like this. Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada. Vestibulum porttitor tristique lorem, ut sagittis neque suscipit id.

Small body font copy would look like this. Sed lobortis, ligula vel molestie porta, nunc erat porttitor sapien, vel hendrerit sapien lectus sit amet purus. Pellentesque condimentum cursus orci rhoncus malesuada. Vestibulum porttitor tristique lorem, ut sagittis neque suscipit id.

Heading 2

Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada. nterdum et malesuada fames ac ante ipsum primis in faucibus. Integer sit amet enim sed orci vehicula pulvinar.

Sed venenatis est eget aliquet rhoncus. Integer eleifend condimentum ipsum et ornare. Praesent non justo quis purus mollis lobortis tempor a velit. Quisque ultrices sapien vel velit dapibus, quis dictum ex imperdiet. 

Heading 3

Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada.

Heading 4

Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada.

Heading 5

Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada.

Heading 6

Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada.

List Items

Unordered list items will look like this:

• Nunc ac justo a felis placerat dictum. Vestibulum congue tellus at sem eleifend, in euismod ligula sagittis.
• Eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada. Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla.
  • Duis ornare ipsum lectus, in feugiat felis mollis vel.
  • Pellentesque condimentum cursus orci rhoncus malesuada.
• Pellentesque condimentum cursus orci rhoncus malesuada.

Numbered list items will look like this:

1. Nunc ac justo a felis placerat dictum. Vestibulum congue tellus at sem eleifend, in euismod ligula sagittis.
2. Eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada. Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla.
   1. Duis ornare ipsum lectus, in feugiat felis mollis vel.
   2. Pellentesque condimentum cursus orci rhoncus malesuada.
3. Pellentesque condimentum cursus orci rhoncus malesuada.

Block Quotes

Here’s what an example of what a default block quote would look like.

Every great developer you know got there by solving problems they were unqualified to solve until they actually did it.

Patrick McKenzie

Eget ipsum posuere enim rhoncus tempor in et nulla. Pellentesque condimentum cursus orci rhoncus malesuada. Duis ornare ipsum lectus, in feugiat felis mollis vel. Etiam eget ipsum posuere enim rhoncus tempor in et nulla.

Tables

Here’s an example of what the default styling of tables, looks like.

Item	Price	Quantity	Total
Cool beans	$0.25/ea	200	$20.00
Not so cool beans	$0.15/ea	35	$5.25
Are these even beans?!?	$0.02/ea	1,776	$35.52
		Subtotal	$60.77
		HST	$7.90
		TOTAL	$68.67

Here’s an example of what the striped styling of tables, looks like.

Item	Price	Quantity	Total
Cool beans	$0.25/ea	200	$20.00
Not so cool beans	$0.15/ea	35	$5.25
Are these even beans?!?	$0.02/ea	1,776	$35.52
		Subtotal	$60.77
		HST	$7.90
		TOTAL	$68.67