Type scale

Every step of the scale as a class, plus the two brand treatments at the end.

Display large

Display medium

Display small

Headline large

Headline medium

Headline small

Title large

Title medium

Title small

Body large

Body medium

Body small

Label large

Label medium

Label small

Brand type

The wordmark sets the brand name at poster scale, and the eyebrow labels a section above its heading. Neither applies a text transform, so an eyebrow is authored in upper case.

MALLEABLE ENGINE

beet

Headings

This is a H1 Heading

Here is some text under the heading

This is a H2 Heading

Here is some text under the heading

This is a H3 Heading

Here is some text under the heading

This is a H4 Heading

Here is some text under the heading

This is a H5 Heading

Here is some text under the heading

This is a H6 Heading

Here is some text under the heading

This is a details panel

Yep its pretty simple! If you want something more styled use Accordion

Paragraphs

This is a paragraph

This is a paragraph with a link

This is a paragraph with strong text

This is a paragraph with emphasized text

This is a paragraph with inline code

This is a paragraph with highlighted text

This is a paragraph with deleted text

This is a paragraph with inserted text

This is a paragraph with small text

This is a paragraph with subscript text

This is a paragraph with superscript text

Lists

An unordered list, with a nested list:

  • First item
  • Second item
    • Nested item
    • Another nested item
  • Third item

An ordered list, with a nested list:

  1. First step
  2. Second step
    1. Nested step
    2. Another nested step
  3. Third step
This is blockquoted text

This is a paragraph with quoted text

This is a paragraph with citation text

This is a paragraph with abbreviated text

This is a paragraph with

This is address text

This is a paragraph with bdi text

This is a paragraph with bdo text

This is a paragraph with samp text

This is a paragraph with kbd text

This is a paragraph with var text

This is a paragraph with dfn text

This is a very long paragraph that should be broken into multiple lines to test the line height and spacing between lines. This is a very long paragraph that should be broken into multiple lines to test the line height and spacing between lines. This is a very long paragraph that should be broken into multiple lines to test the line height and spacing between lines.