Typography
Paragraph styles
Default paragraph
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
Light paragraph
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
Semibold paragraph
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
Bold paragraph
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
Heading styles
Light headings
H1 Heading (28px)
H2 Heading (24px)
H3 Heading (21px)
h4 Heading (18px)
h5 Heading (16px)
h6 Heading (13px)
Regular headings
H1 Heading (28px)
H2 Heading (24px)
H3 Heading (21px)
h4 Heading (18px)
h5 Heading (16px)
h6 Heading (13px)
Semibold headings
H1 Heading (28px)
H2 Heading (24px)
H3 Heading (21px)
h4 Heading (18px)
h5 Heading (16px)
h6 Heading (13px)
Bold headings
H1 Heading (28px)
H2 Heading (24px)
H3 Heading (21px)
h4 Heading (18px)
h5 Heading (16px)
h6 Heading (13px)
Heading elements
Left icon
Left positioned heading icon
Right inline icon
Right inline icon position
Right floating icon
Right floating icon
New Left label
Left positioned heading label
Right inline label New
Right inline heading label
Right floating label New
Right floating heading label
18 Left badge
Left positioned heading badge
Right inline badge 18
Right inline heading badge
Right floating badge 18
Right floating heading badge
List options
Default unordered list
- Lorem ipsum dolor sit amet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Faucibus porta lacus fringilla
- Aenean sit amet erat nunc
Square list type
- Lorem ipsum dolor sit amet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Faucibus porta lacus fringilla
- Aenean sit amet erat nunc
Default ordered list
- Lorem ipsum dolor sit amet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Faucibus porta lacus fringilla
- Aenean sit amet erat nunc
List with icons
Inline list options
Default inline list
- 1. First item
- 2. Second item
- 3. Third item
Condensed inline list
- 1. First item
- 2. Second item
- 3. Third item
Separated inline list
- First item
- Second item
- Third item
Description lists
- Description lists
- A description list is perfect for defining terms.
- Euismod
- Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
- Donec id elit non mi porta gravida at eget metus.
- Malesuada porta
- Etiam porta sem malesuada magna mollis euismod.
- Truncated term is truncated
- Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
- Nesting
-
- Nested definition list
- Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.
Blockquote options
Left blockquote
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Right blockquote
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Left blockquote with image
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Right blockquote with image
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.