awesome-design-md and the shadcn skill

npx skills add shadcn/ui

Does every page Claude Code builds still look like default shadcn? If you want the feel of Stripe or Linear, use these two together:

1. awesome-design-md. Pick the look you want here first. It’s an open-source repo with 120K stars: DESIGN.md files written in the style of 74 products, including Stripe, Linear, Vercel and Notion. They’re community-written interpretations of each brand’s style. Colors, fonts, spacing, corner radius, shadows, plus what to do and what to avoid, are all in there for an agent to read.
2. The official shadcn skill. Hand it the one you picked. It starts a new project without touching your existing code, installs every component, and restyles the whole set to match that DESIGN.md. When it’s done, you get a design system page: colors checked for contrast, every state of every component laid out, and do’s and don’ts side by side.

Once it’s installed, open the DESIGN.md you picked on GitHub, click Raw to copy its link, and send this to Claude Code.

Use the shadcn skill to start a new Next.js project, build a design system from this DESIGN.md, and finish with a design system page. Download the file into the project before you read it: <Raw link>

Not happy with it? Pick another one and run it again. Once one fits, have Claude Code move the theme and components into your project, and make it your own from there.