Colors ​

Accent Colors ​

Accent
oklch(92% 0.15 115)
Accent Dark
oklch(80% 0.15 115)
Accent Light
oklch(96% 0.2 115)
Accent Soft
oklch(92% 0.15 115 / 0.14)

Heading Colors ​

Heading
oklch(87% 0.18 100)
Heading Dark
oklch(75% 0.18 100)
Heading Light
oklch(93% 0.15 100)
Heading Soft
oklch(87% 0.18 100 / 0.14)

Gray Scale ​

Gray 1
oklch(89% 0.02 85)
Gray 2
oklch(75% 0.02 85)
Gray 3
oklch(60% 0.02 85)
Gray Soft
oklch(60% 0.02 85 / 0.14)

Text Colors ​

Text Base
oklch(14% 0.01 70)
Text Muted
oklch(20% 0.01 70)
Text Heading
oklch(10% 0.01 70)

Typography ​

Font Families ​

Victor Mono

The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.

Mono / --font-monovar(--font-victor-mono)
Lilita One

The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.

Heading / --font-family-headingvar(--font-lilita-one)
Brawler

The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.

Serif / --font-serifvar(--font-brawler)
Nunito

The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.

Body, Sans / --font-family-body, --font-sansvar(--font-nunito)

Heading Levels ​

Heading 1

h1var(--font-size-6xl)var(--font-weight-bold)

Heading 2

h2var(--font-size-4xl)var(--font-weight-black)

Heading 3

h3var(--font-size-2xl)var(--font-weight-black)

Heading 4

h4var(--font-family-body)var(--font-size-2xl)var(--font-weight-black)
Heading 5
h5var(--font-family-body)var(--font-size-xl)var(--font-weight-black)
Heading 6
h6var(--font-family-body)var(--font-size-lg)var(--font-weight-black)

Font Size Scale ​

xsclamp(0.75em, 0.7em + 0.25vw, 0.875em)Sample
smclamp(0.875em, 0.85em + 0.125vw, 1em)Sample
base1emSample
lgclamp(1.125em, 1.05em + 0.375vw, 1.25em)Sample
xlclamp(1.25em, 1.15em + 0.5vw, 1.5em)Sample
2xlclamp(1.5em, 1.3em + 1vw, 2em)Sample
3xlclamp(1.75em, 1.4em + 1.75vw, 2.5em)Sample
4xlclamp(2em, 1.5em + 2.5vw, 3em)Sample
5xlclamp(2.5em, 1.75em + 3.75vw, 4em)Sample
6xlclamp(3em, 2em + 5vw, 5em)Sample
7xlclamp(3.5em, 2.25em + 6.25vw, 6em)Sample

Font Weights ​

thin100Sample
extralight200Sample
light300Sample
normal400Sample
medium500Sample
semibold600Sample
bold700Sample
extrabold800Sample
black900Sample