A fixed point
for design decisions.
Every rule here was extracted from a decision that actually shipped in a real app — named, with the file it lives in. Read it as a portable file any AI tool can load, hand it to Claude as a Skill, or install the components it produced with one command.
or browse components →terminal
$ npx @dhruvchoudhary/dsgn add button cardThe CLI copies component source into your project. You own the file the moment it lands — edit it freely, nothing to eject later.
One prompt. A real app.
5 genuine external projects, each installing this registry from npm like any other consumer, each shipped from one prompt to a design-focused Claude Code agent.
Halyard
corporateA fictional product-analytics workspace — five views, a hand-drawn traffic chart, and a filterable event schema registry.
Alcove
soft-minimalA fictional planning tool for a small product team — a Kanban board, a grouped list, and a person-lane timeline, all sharing one non-destructive overlay model.
Thrum
startupA fictional community feed — pulses, sparks, echoes, and rooms — with a live accent-preset switcher that reskins every installed component from one attribute.
Sableroot
editorial-warmA fictional small-batch coffee roastery — catalog, cart, and checkout across a genuine multi-page storefront, in the editorial-warm voice.
VOLTGATE
neon-cyberpunkA fictional edge API developer console — keys, webhooks, request logs, and feature flags, in the loudest of the seven voices applied to the densest kind of surface.
the prompt, in short
“Build a standalone showcase/demo site that proves out dsgn — a real, working example of what someone gets when they install it into a fresh project. It needs to actually look good, not just function.”
Embed the live component count
Backed by the real registry — updates itself on every build, never a stale number.
[](https://design.dhruvchoudhary.com/components)[](https://design.dhruvchoudhary.com/examples)Physical separation
01Logic that can't import your UI framework, enforced by the build — not a naming convention.
shipped in lyric-viewer →One scheduler
02Every background job goes through one deliberate engine, never an ad-hoc thread per call site.
shipped in lyric-viewer →Non-destructive by default
03Edits are an overlay over an untouched original. Undo is structural, not reconstructed.
shipped in file-viewer →Trust the data
04Gatekeep structure, never content. The user's data is the user's data.
shipped in file-viewer →Measure, don't guess
05Performance claims are proven against the real thing, under real load, more than once.
shipped in lyric-viewer →Idioms stay current
06Framework footguns from stale training data get written down with their exact failure mode.
shipped in review-grader →