Skip to content

Beetroot Riso rebrand — theme, landing, and logos#27

Closed
btravers wants to merge 1 commit into
mainfrom
design/beetroot-riso
Closed

Beetroot Riso rebrand — theme, landing, and logos#27
btravers wants to merge 1 commit into
mainfrom
design/beetroot-riso

Conversation

@btravers

Copy link
Copy Markdown
Contributor

What

A full rebrand of the btravstack design system — "Beetroot Riso": the brand becomes a risograph-printed contract. Riso printing = flat spot-colors on cream paper, hard edges, visible ink, slight misregistration — and beetroot pink is a classic riso ink. The signature is the doc, literally.

@btravstack/theme (minor, changeset included)

  • Light cream paper is now canonical (oklch(96.5% 0.010 353)); dark becomes the soil-black "night edition" via .dark. Hue never changes between schemes.
  • Typography: Bricolage Grotesque (display) + Geist (body) + JetBrains Mono (code) replace Montserrat.
  • Shape language: square corners (--radius-*: 0), hard-offset shadows (no blur, no glow), 2px ink rules, solid non-frosted navbar, solid ink hero name.
  • Non-breaking: all semantic tokens keep their names; docs sites still rebrand with the single --accent override.

Landing

Rebuilt as a manifesto/contract: declaration hero (“THE SIGNATURE IS THE DOC.”), numbered clauses (§01–03), the four packages as a ruled spec-sheet (§1–4), a full-bleed ink section for the AI argument, an oversized block CTA, and a mono colophon footer that closes with a signature line. All copy is preserved verbatim.

Logos

All five marks + favicon redrawn as flat riso prints — solid spot-colors, hard edges, no gradients, one deliberate misregistration offset per mark. Each project keeps its concept (rabbit / hourglass / no-throw / shield / beetroot).

Also new

  • design.md — the locked design system future pages read first.

Verification

  • pnpm build green (theme + website).
  • Both schemes screenshot-verified; contrast checked (WCAG AA on text, 3:1 on large/rings) in light and dark.
  • No horizontal overflow at 320 / 375 / 414 / 768 px (measured via DOM scrollWidth, not eyeballed).

Follow-ups (out of scope here)

  • og-btravstack.png still shows the old branding — needs a re-export.
  • Rolling the riso logo/icon sets into the four sibling docs repos once the theme is published.

Note: this branch is based on design/landing-tweaks, so it also carries 8a8f0f1 (section reorder, drop 'betterave').

The brand becomes a risograph-printed contract: flat spot-colors on
beet-tinted cream paper, hard edges, square corners, 2px ink rules,
hard-offset shadows, and a deliberate misregistration layer on every mark.

- theme: light-cream canonical scheme (dark "night edition" via .dark),
  Bricolage Grotesque + Geist + JetBrains Mono, square radii, no glow/
  gradient text. Semantic token API and the one-knob --accent contract
  are unchanged (minor bump, changeset included).
- landing: Manifesto structure — declaration hero, numbered clauses,
  packages as a ruled spec-sheet, ink-bleed AI section, oversized block
  CTA, colophon signature footer. All copy preserved.
- logos: all five marks + favicon redrawn as flat riso prints (no
  gradients), keeping each project's concept.
- design.md: the locked design system for future pages.
Copilot AI review requested due to automatic review settings July 15, 2026 22:59

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR delivers the “Beetroot Riso” rebrand across the shared theme package and the website landing page, plus a refreshed set of flat risograph-style SVG marks, anchored by a new locked design-system document (design.md).

Changes:

  • Reworked @btravstack/theme tokens and VitePress variable mapping to make the light “cream paper” scheme canonical, with a .dark “night edition” override; updated typography and shape/shadow language.
  • Rebuilt the landing page into a manifesto/contract layout (clauses, spec-sheet packages section, ink-bleed AI section, block CTA, colophon footer).
  • Redrew the org/package logos and favicon as flat riso-print SVGs and added a changeset + Hallmark log entry.

Reviewed changes

Copilot reviewed 7 out of 18 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
packages/theme/src/tokens.css Updates canonical scheme to light, revises palette/typography/radii/shadows and scheme override behavior.
packages/theme/src/style.css Remaps tokens to VitePress --vp-* variables and applies “riso chrome” global styling (nav, cards, focus, etc.).
packages/theme/src/fonts.css Switches Google Fonts import to Bricolage Grotesque + Geist + JetBrains Mono.
design.md Adds a locked “Beetroot Riso” design system reference for future pages.
apps/website/public/logos/unthrown-light.svg Replaces the Unthrown light mark with the new flat riso SVG.
apps/website/public/logos/unthrown-dark.svg Replaces the Unthrown dark mark with the new flat riso SVG.
apps/website/public/logos/temporal-contract-light.svg Replaces the Temporal Contract light mark with the new flat riso SVG.
apps/website/public/logos/temporal-contract-dark.svg Replaces the Temporal Contract dark mark with the new flat riso SVG.
apps/website/public/logos/demesne-light.svg Replaces the Demesne light mark with the new flat riso SVG.
apps/website/public/logos/demesne-dark.svg Replaces the Demesne dark mark with the new flat riso SVG.
apps/website/public/logos/btravstack-light.svg Replaces the org light mark with the new flat riso SVG.
apps/website/public/logos/btravstack-dark.svg Replaces the org dark mark with the new flat riso SVG.
apps/website/public/logos/amqp-contract-light.svg Replaces the AMQP Contract light mark with the new flat riso SVG.
apps/website/public/logos/amqp-contract-dark.svg Replaces the AMQP Contract dark mark with the new flat riso SVG.
apps/website/public/favicon.svg Updates the favicon to the new flat riso beet mark.
apps/website/.vitepress/theme/Landing.vue Rebuilds the landing page structure and styles into the manifesto/contract layout.
.hallmark/log.json Adds a Hallmark log entry for the rebrand work.
.changeset/beetroot-riso-rebrand.md Adds a minor changeset describing the theme rebrand and its token-level behavior.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

* --text-accent / --text-green for COLORED TEXT and icons — light mode
* darkens those to deep beetroot so links/labels pass WCAG-AA on cream.
*/
:root {
Comment thread design.md

## Motion

- Easings: `--ease-out: cubic-bezier(0.16, 1, 0.3, 1)`; durations ≤ 0.2 s.
Comment thread design.md
--font-display: "Bricolage Grotesque", sans-serif;
--font-body: "Geist", sans-serif;
--font-mono: "JetBrains Mono", monospace;
--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants