Typography
xs
sm
md
lg
xl
xxl
Heading 1 / H1
Heading 2 / H2
Heading 3 / H3
Heading 4 / H4
Heading 5 / H5
Heading 6 / H6
This is a .lead paragraph. It stands out from regular paragraphs.
Adobe Figtree font ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. .text-primary class ad minim veniam, .text-secondary class quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur .fw-bold class occaecat cupidatat non proident, link to something in culpa qui officia deserunt mollit anim id est laborum.
How vexingly quick daft zebras jump! This is .small class text.
You can use the <mark> tag to highlight text.
Line-height (leading) can be condensed by applying a class of .lh-sm. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
A well-known quote, contained in a .blockquote element.
Colors available in the AAP theme:
Roboto, Helvetica, Arial, sans-serif
- List Item
- Another List Item
- .text-primary class
- .text-primary 50% opacity (style="--bs-text-opacity: .5;")
- .text-secondary class, .text-danger class
- .text-success class, .text-info class
- .text-warning class
- .text-warning bg-dark class
- This is a .secondary class unordered list item
- This is another .secondary class unordered list item
- Here is a third item
.btn-light with text color & border inline styles .btn .btn-carrot Learn More .btn .btn-lochmara Learn More .btn .btn-lochmara-o Outline
Display 1
Display 2
Display 3
Display 4
Display 5
Display 6
► #9658;