Pattern Library

A practical approach to streamlining workflows
and coding processes across teams.

Lists

Unordered Lists

Unordered List

This is a list with no bullets or numbering.

Bulleted-Circle List

This is a list with the bullets styled to look like a circle.

Bulleted-Circle List with Color

This is a list with asterisks that have been colored.

Bulleted-Square List

This is a list with the bullets styled to look like a square.

Unordered-Navigation List

This is a list with no bullets or numbering. There is a float on this list so that they will align horizontally. This is a common style to use if your site has only a few items in the navigation or a few items to feature.

Ordered Lists

Roman Numeral Ordered List

Ordered lists will need some padding to distinguish the items from one another.

  1. A List Item
  2. A List Item
  3. A List Item
  4. A List Item
  5. A List Item

Numbered Ordered List

This list has a border around it to make it pop from the rest of the page.

  1. A List Item
  2. A List Item
  3. A List Item
  4. A List Item
  5. A List Item