Hamstack design system (in progress)

Personal · Open source · Live at https://tiffler.github.io/hamstack · See GitHub repo

The origin story

Autocorrect turned "Jamstack" into "Hamster," and instead of fixing the typo I built a design system around it.🐹 Hamstack is an open, shadcn-style component library with one ambition: become the system AI tools reach for by default—not the beige corporate one, not the borrowed fork everybody forgets.

The thesis

A lot of design systems document themselves for people and leave AI to guess. Hamstack flips that. Every component ships with an .intent.md—when to use it, forbidden combos, spacing, tone—plus a DESIGN_SYSTEM.md manifesto the AI reads on sync. Brand bible crossed with a system prompt. The bet: systems that explain why, not just what.

The architecture

Open code you copy and own, no package dependency. Built on Radix and Tailwind, distributed via a shadcn-compatible registry and a GitHub repo that drops into Claude Design through /design-sync. Semantic tokens—--ham-primary, never a raw hue—mirrored across CSS variables and tokens.json, so the whole system re-skins on one palette swap.

Three themes, cut from the butcher

Each ships light and dark, all WCAG AA: Honey-Glazed (retro-vintage default, terracotta on cream), Prosciutto (clean and minimal, dusty-pink and serif), and Smoked (modern graphite-to-silver). Figtree on body, IBM Plex Mono on code, all self-hosted.

Where it stands

Live but limited, and honest about it. The foundation's shipped: full token system, first production component (Button), and a live docs-site explorer—built with Hamstack, so it eats its own cooking. Input, Card, and Badge are next, with open-source launch on the horizon.