LIGHT 1 - Cream Background
Heading 1 — Display Headline Sample
Heading 2 — Section Headline Sample
Heading 3 — Subsection Heading
Heading 4 — Minor Heading and Label
Paragraph 1 — The largest body size. Read this line for comfort: check the weight, the space between lines, and whether it holds across a sentence or two on this background.
Paragraph 2 — The default body size for most running text. Watch how it feels at a natural reading distance and whether the line height keeps things from crowding.
Paragraph 3 — The smallest body size, for captions and fine print. This is where legibility is tested hardest, especially on color or on dark.
Paragraph link — this phrase is the link, shown in the theme link color.
Secondary and muted text — warm gray, for metadata and deemphasized notes.
EYEBROW / KICKER — SAMPLE LABEL
Rock Salt accent callout — sample line
“Holy sh*t. That was exactly what we needed. We should see if we can do this with each of our direct report teams.”
“Because work needs rebels”
LIGHTEST 1 - White Background
Heading 1 — Display Headline Sample
Heading 2 — Section Headline Sample
Heading 3 — Subsection Heading
Heading 4 — Minor Heading and Label
Paragraph 1 — The largest body size. Read this line for comfort: check the weight, the space between lines, and whether it holds across a sentence or two on this background.
Paragraph 2 — The default body size for most running text. Watch how it feels at a natural reading distance and whether the line height keeps things from crowding.
Paragraph 3 — The smallest body size, for captions and fine print. This is where legibility is tested hardest, especially on color or on dark.
Paragraph link — this phrase is the link, shown in the theme link color.
Secondary and muted text — warm gray, for metadata and deemphasized notes.
EYEBROW / KICKER — SAMPLE LABEL
Rock Salt accent callout — sample line
“Holy sh*t. That was exactly what we needed. We should see if we can do this with each of our direct report teams.”
DARK 1 - Magenta Background
Heading 1 — Display Headline Sample
Heading 2 — Section Headline Sample
Heading 3 — Subsection Heading
Heading 4 — Minor Heading and Label
Paragraph 1 — The largest body size. Read this line for comfort: check the weight, the space between lines, and whether it holds across a sentence or two on this background.
Paragraph 2 — The default body size for most running text. Watch how it feels at a natural reading distance and whether the line height keeps things from crowding.
Paragraph 3 — The smallest body size, for captions and fine print. This is where legibility is tested hardest, especially on color or on dark.
Paragraph link — this phrase is the link, shown in the theme link color.
No muted or secondary text on this band — the magenta CTA band is white-text-only in the design, so there's no warm-gray pairing to test here.
EYEBROW / KICKER — SAMPLE LABEL
Rock Salt accent callout — sample line
This primary button’s BG and font color have been tweaked so they appear on this test page.
“Holy sh*t. That was exactly what we needed. We should see if we can do this with each of our direct report teams.”
DARKEST 2 - Near Black Background
Heading 1 — Display Headline Sample
Heading 2 — Section Headline Sample
Heading 3 — Subsection Heading
Heading 4 — Minor Heading and Label
Paragraph 1 — The largest body size. Read this line for comfort: check the weight, the space between lines, and whether it holds across a sentence or two on this background.
Paragraph 2 — The default body size for most running text. Watch how it feels at a natural reading distance and whether the line height keeps things from crowding.
Paragraph 3 — The smallest body size, for captions and fine print. This is where legibility is tested hardest, especially on color or on dark.
Paragraph link — this phrase is the link, shown in the theme link color.
No on-dark links in the design — DARKEST 2's link color is set to poison lime (#00FF00) on purpose, as a detector so any stray on-dark link lights up.
Secondary and muted text — warm gray, for metadata and deemphasized notes.
EYEBROW / KICKER — SAMPLE LABEL
Rock Salt accent callout — sample line
“Holy sh*t. That was exactly what we needed. We should see if we can do this with each of our direct report teams.”