Small apps, not just components.
A single Button or Switch in isolation doesn’t tell you much about how it holds up in real layout. These are small, realistic compositions — a sign-in form, a settings panel, a team list, a dashboard, pricing tiers, a live search — built entirely from the same registry components shown on their own elsewhere on this site.
Sign in
Card + Input + Checkbox + Button — a real auth form, not a lorem-ipsum mockup.
Welcome back
Sign in to your dsgn account.
Settings panel
Card + Switch + Select + Separator — a preferences screen, staged not mutated.
Preferences
Changes apply on Save, not as you toggle them.
Team list
Avatar + Badge + DropdownMenu — a real list with per-row actions.
Stat row
Real numbers about this project — not placeholder dashboard data.
23
Registry components
3
Case studies
9
Philosophy pillars
Project dashboard
Table + Badge + Skeleton — the real 3 case studies, plus a loading row for contrast.
Case studies
Every project this design philosophy was extracted from.
| Project | Stack | Status |
|---|---|---|
| lyric-viewer | Tauri 2 + Rust | Shipped |
| file-viewer | .NET / WPF | Shipped |
| review-grader | Angular 17.3 | Shipped |
Pricing tiers
Card + Badge + Button — a 3-tier plan layout (illustrative pattern, not an actual dsgn plan).
Community
Everything in the registry, MIT licensed.
Free
- Full component registry
- npx @dhruvchoudhary/dsgn add
- Unlimited projects
Team
For teams standardizing on one registry.
Custom
- Everything in Community
- Private component registry
- Shared token overrides
Enterprise
SSO, audit logs, dedicated support.
Custom
- Everything in Team
- SSO / SAML
- Dedicated support channel
Component search
Command — searching this registry's real component list, not sample data.