Better Design: 28 Shadcn design systems with integrated MCP server

Shadcn/UI has been the reference component library in the React ecosystem for two years, but building a coherent design system on top of it still requires considerable manual work. This week, developer marvkr published on GitHub an open source repository called Better Design that brings together 28 complete design systems built on Shadcn, with a relevant feature for Claude Code and Cursor users: it includes a ready-to-connect MCP server.

The announcement appeared on May 5th on Hacker News as Show HN with modest traction (three points, no comments at the time of publication), placing it more in the category of early-stage project than mature launch. Still, the proposal deserves attention because it addresses a concrete practical problem.

What the repository offers

Better Design is essentially a curated collection of visual variants for Shadcn components. Each of the 28 systems includes its own palette, typography, spacing, and design tokens, so they can be adopted as a starting point without building from scratch. The code is open source and available directly in the repository.

What sets it apart from a simple theme gallery is the included MCP server. Configured in Claude Code or Cursor through the `claude_desktop_config.json` file, this server exposes design variants as invocable tools. The idea is that the agent can query, compare, and apply design systems during a UI code generation session, without the developer having to manually copy and paste tokens.

In practice, this means you can tell Claude Code something like "use design system number 12 from Better Design for this form component" and the agent retrieves the relevant tokens through the MCP server instead of relying solely on prompt context.

Why it makes sense in the current workflow

MCP servers have become the standard mechanism for extending Claude Code with specialized tools. Until now, most published servers point to integrations with external APIs, databases, or infrastructure services. An MCP server oriented purely toward UI design resources is less common.

The use case is clear for small teams or individual developers working with React who want to delegate visual consistency to Claude Code without maintaining their own design system. Instead of describing in the prompt what a component should look like, you reference a predefined system and let the agent apply it consistently throughout the session.

It can also be useful in rapid prototyping projects where the goal is to have a presentable interface without investing time in design decisions. The 28 available systems cover different styles (minimalist, with stronger typography presence, color-rich variants), providing room to choose without building anything from scratch.

Caveats to keep in mind

The project is new and has limited visibility at the time of writing. There is no extensive documentation on how the MCP server is implemented, what tools it exposes exactly, or how it manages updates to design systems when Shadcn releases changes. These are reasonable questions before integrating it into a real workflow.

It is also unclear what criteria the author followed to select or generate the 28 systems. Whether they are original designs, adaptations of known references, or outputs from generative models is something the repository does not explain in detail in its current state.

Finally, the absence of activity in the Hacker News thread suggests the community has not yet had time—or sufficient interest—to evaluate it in depth. That does not disqualify the project, but it is worth reviewing it with calibrated expectations.

---

Our take: The combination of static design resources with an MCP server is a pattern we expect to see more of in the coming months. Better Design is an interesting first step, though it needs more documentation and real-world use before we can recommend it as a stable dependency.