- Home
- Style Guide
- Style Guide: Text Options
Level 1 Heading (H2 / 28px)
Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Level 1 Heading with Underline (H2 / 28px)
Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Level 2 Heading (H3 / 24px)
Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Level 2 Heading with Underline (H3 / 24px)
Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Level 3 Heading (H4 / 22px)
Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Level 3 Heading with Underline (H4 / 22px)
Body text (P / 16px) - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Original Quote Block
The CAP 15189 program gives us the tools and the structure needed to identify and document nonconformities and then drill down to the root cause(s). Thanks to the program, we are in a continuous state of improvement making us inspection-ready at all times.
Jessica DesLauriers, MLS (ASCP)CM
Quality Management Systems & Education Manager, Laboratory
Avera McKennan Hospital & University Health Center
- Line 1
- Line 2
- Line 3
Infinite Button Row
Additional Body Copy Options
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur.
List (H5/20px - WYSIWYG):
A) unordered list
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Nulla egestas accumsan tortor eget lacinia.
- Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo.
- Duis in cursus urna.
- Maecenas pretium vel ligula eget efficitur.
- Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Nulla egestas accumsan tortor eget lacinia.
- Aliquam interdum, augue in egestas tempus
B) ordered list
- Duis in cursus urna.
- Maecenas pretium vel ligula eget efficitur.
- Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar.
- Mauris tincidunt suscipit ipsum ac rhoncus.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Nulla egestas accumsan tortor eget lacinia.
- Aliquam interdum, augue in egestas tempus
- Duis in cursus urna.
- Maecenas pretium vel ligula eget efficitur.
- Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar.
Table (H5/20px - WYSIWYG):
| Title 1 | Title 2 | Title 3 |
|---|---|---|
| Title 1 | Title 2 | Title 3 |
| Lorem ipsum | Lorem ipsum | Lorem ipsum |
| Title 1 | Title 2 | Title 3 |
|---|---|---|
| Lorem ipsum | Lorem ipsum | Lorem ipsum |
SuperTable Accordion Block
- Open all
- Close all
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Column layout
2 Column (H5/20px - WYSIWYG):
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
3 Column (H5/20px - WYSIWYG):
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla egestas accumsan tortor eget lacinia. Aliquam interdum, augue in egestas tempus, nibh nibh viverra justo, eu eleifend leo justo in leo. Duis in cursus urna. Maecenas pretium vel ligula eget efficitur. Nulla sed ornare nulla. Fusce blandit vel lacus eget pulvinar. Mauris tincidunt suscipit ipsum ac rhoncus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi est lectus, vulputate in tincidunt quis, tempor non justo. Cras magna dolor, ornare ut pellentesque id, commodo vitae velit.
Icons (currently available)
- arrow-right
- bar-chart
- check-circle
- chevron-up
- chevron-down
- chevron-left
- chevron-right
- chrome
- close
- desktop
- edge
- exclamation-circle
- file-search
- file-text-o
- firefox
- internet-explorer
- lock
- newspaper
- safari
- search
- shopping-cart
- times-circle
- user
- youtube
- youtube-play