Delegate ComputerDelegateDelegate Design System, home
Delegate Computer

The Delegate design system

shadcn/ui is free, MIT-licensed, and copied into your repo rather than installed. What it does not give you is a palette, a motion language, or a decision about what your product feels like. This repository is that layer for Delegate Computer.

What you get

The shadcn article puts it plainly: free does not mean finished. Layouts, custom variants, and design-to-code translation stay your problem. These are the pieces that close that gap here.

  • A contrast-verified light and dark theme in OKLCH
  • 30 shadcn primitives, owned in-repo, with Delegate status variants
  • Brand primitives: the dots, the wash, the rise cascade, the mark
  • A DTCG token export for Figma Variables and Style Dictionary
  • A shadcn registry — consume it with npx shadcn add
  • A CI gate that fails the build on an inaccessible token
Paper, not console
Most shadcn products default to a dark neutral. Delegate is warm and light-first — #fbfaf7 paper, #1f1e1b ink. Dark mode exists and keeps the same 91.5° warm hue instead of collapsing to zinc.
Contrast is a build step
Every pairing the system promises is asserted by pnpm check:contrast, which reads the real CSS. 38 checks run in CI. A token that fails WCAG cannot be merged.
Motion carries the brand
The entry page's rise — 10px up, 700ms, cubic-bezier(0.2, 0.7, 0.3, 1), staggered 140ms — is a token and a component, not a one-off. Reduced motion is honoured globally.

Install into a product

registry

The theme and the brand primitives ship as registry items. Pull the theme first — it carries the tokens every component depends on.

npx shadcn@latest add https://design.delegatecomputer.com/r/delegate-theme.json
npx shadcn@latest add https://design.delegatecomputer.com/r/brand-dots.json

Run pnpm registry:build to regenerate public/r/ after changing a component.