NewDS Manager

The visual editor for your shadcn/ui design system

Every token and every component on a canvas. Change it where you can see it, then install it in your project with one command.

Why I built this

AI made it easy to change a design system and hard to see what it changed. Claude or Cursor will edit your tokens and components, but agents do not care about the details designers do. I also find it easier to edit padding the old way and see how it changes live than ask AI to do it and wait...

I hit this on a bigger client project and decided to build the tool I was missing. Now every design system I start, for a client or for my own app, begins here. This is where the source of truth lives, and I can see every change before it ships.

MW
Matt Wierzbicki

Founder @ shadcndesign.com

What you get

A design system you can see while editing

Every page shows real shadcn/ui components. Change a token or a component style, and the canvas updates in front of you.

Add or change a token once, see it everywhere

Color, typography, spacing, radius, shadow, icons and brand each get a page with live components. Light and dark are two palettes, edited one at a time. Every text-on-surface pair shows its WCAG ratio as you go.

Style shadcn/ui components

Ask the agent, watch it work

Start from an official style, not a blank file

One command to install. One to update.

Show the whole system with one link

Add or change a token once, see it everywhere
Pricing

Free to start.
Pro when you need more.

The full editor is free and needs no account. Sign in to sync your systems, publish a registry and use the agent.

Free

$0USD

Free forever

  • 3 systems
  • 1 published registry
  • $1 of AI usage once
  • Full editor access
  • Share links

Pro

Save $48

$15USD

$180 billed yearly

Great if you manage multiple systems

  • 30 systems
  • 10 published registries
  • $5 of AI usage monthly
  • Full editor access
  • Share links
  • Bring your own AI API keys
  • All future Pro features

Enter your GitHub account email at checkout, then sign in with that account.

Payments by Polar. Tax is added at checkout where it applies. AI usage costs what the model provider charges, and the agent stops at zero rather than billing you more. Cancel any time. No refunds, so try Free first.

FAQ

Questions and answers

Yes. The editor is free with no account, and the Free plan gives you 3 systems, 1 published registry and $1 of AI usage. Pro adds room for 30 systems, 10 published registries and $5 of AI usage a month, or $5 once on Lifetime.

No. Everything runs in your browser until you sign in. Sign in with GitHub when you want your systems synced across devices, a published registry, share links or the agent.

Publish it, then run the install command from the Get code dialog. It is a standard shadcn/ui registry, so the shadcn CLI writes your tokens and components into the project. Publish again and run the update command to pull the changes.

Yes, if it runs Next.js and Tailwind v4. The adopt command switches the project's components.json to your style, base color and icon library, then reinstalls every component it finds with your version. Commit first, since it overwrites those files.

All 8 official shadcn/ui styles and 61 components, built on Base UI from a pinned shadcn/ui release. Exports target a Next.js project with Tailwind v4.

Yes, on Pro. Add an Anthropic, OpenAI, xAI or Google key in Settings and the agent runs on your account with the model you choose. Keys are checked with the provider, stored encrypted and never shown again.

The agent stops. It never bills you for more. Monthly and yearly Pro refill $5 each month, Lifetime gets $5 once, and Pro can bring its own AI API keys for unlimited use.

You can cancel a monthly or yearly plan any time and keep Pro until the period ends. There are no refunds. The editor and the Free plan come first so you can try it before you pay.