Brand

A living reference for the visual language of this site. Pulled live from theme.json — update the source, refresh this page, the guide moves with you.

Colors

Theme palette pulled from theme.json. CSS variables follow the --wp--preset--color--{slug} pattern.

  • Primary --wp--preset--color--primary #c6068c
  • Secondary --wp--preset--color--secondary #1fff6f
  • Base --wp--preset--color--base #f5f2ef
  • Base 2 --wp--preset--color--base-2 #F7F7F7
  • Base 3 --wp--preset--color--base-3 #EBEBEB
  • Base 4 --wp--preset--color--base-4 #E3DCCD
  • Contrast --wp--preset--color--contrast #000000
  • Contrast 2 --wp--preset--color--contrast-2 #111111
  • Accent --wp--preset--color--accent-1 #00c2e0
  • Accent 2 --wp--preset--color--accent-2 #342975
  • Accent 3 --wp--preset--color--accent-3 #68bbe4
  • Accent 4 --wp--preset--color--accent-4 #ffb400
  • Surface --wp--preset--color--surface #1A1A1A
  • Muted --wp--preset--color--muted #555555
  • Muted Mid --wp--preset--color--muted-mid #888888
  • Muted Light --wp--preset--color--muted-light #999999
  • Black --wp--preset--color--black #000000
  • White --wp--preset--color--white #FFFFFF

Typography

Registered font families. Reference via var(--wp--preset--font-family--{slug}).

  • Early Sans --wp--preset--font-family--early-sans "early-sans-variable", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

  • Late Serif --wp--preset--font-family--late-serif "late-serif-variable", Georgia, "Times New Roman", serif

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

  • Vinila Variable --wp--preset--font-family--vanila-variable "vinila-variable", "vinila", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

  • Allenoire --wp--preset--font-family--allenoire Allenoire, Georgia, serif

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

  • JetBrains Mono --wp--preset--font-family--jetbrains-mono "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

  • Brooklyn Heritage Script --wp--preset--font-family--brooklyn-heritage-script "brooklyn-heritage-script", "Snell Roundhand", "Apple Chancery", "Lucida Calligraphy", cursive

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

  • Sheila --wp--preset--font-family--sheila "sheila", "Snell Roundhand", "Apple Chancery", "Brush Script MT", cursive, sans-serif

    Aa Bb Cc — The quick brown fox jumps over the lazy dog. 0123456789

Type Scale

Preset sizes, in source order. Use via var(--wp--preset--font-size--{slug}).

  • The quick brown fox Small small 0.875rem
  • The quick brown fox Medium medium 1rem
  • The quick brown fox Large large 1.38rem
  • The quick brown fox Extra Large x-large 1.75rem
  • The quick brown fox Extra Extra Large xx-large 2.15rem

Spacing Scale

Preset spacing tokens. Use via var(--wp--preset--spacing--{slug}).

  • 1 10 clamp(0.5rem, 1vw, 0.75rem)
  • 2 20 clamp(1rem, 2vw, 1.5rem)
  • 3 30 clamp(2rem, 4vw, 3rem)
  • 4 40 clamp(3rem, 6vw, 5rem)
  • 5 50 clamp(5rem, 10vw, 8rem)
  • 6 60 clamp(6rem, 14vw, 12rem)
  • 7 70 clamp(6rem, 14vw, 12rem)
  • 8 80 clamp(6rem, 14vw, 12rem)