Make your app feel expensive. Pay $79, once.
Every Pro component and screen, as code in your own project. Pay once, change anything, keep it.
Detent Pro
$99$79once
19 Pro components, 12 screens and 1 template, for one person. $79 with code DETENT20 at checkout. Launch price: it goes up as the library grows. One payment · Every update for life · 14-day refund · The source is yours
Take a closer look.These are yours with Pro.
Free, or Pro.What each one gets you.
| Free | Pro | |
|---|---|---|
| Price | Free$0 | Pro |
| Components | Free18 | ProAll 37 |
| Blocks, whole screens | Free5 | ProAll 17 |
| App templates | Free— | Pro1, and every new one |
| Takes your shadcn theme | Free | Pro |
| Installs from | FreePublic registry | ProPrivate registry |
| People | FreeAnyone | ProOne |
| Licence | FreeMIT | ProUnlimited projects |
This is the start. New components, blocks and templates are on the way, included in your plan when they land.
What’s inside.Every piece, by name.
Components 19
Blocks 12
Templates 1
Included in Pro
Questions.Before you buy.
Who is it for?
Developers building a product in React who want it to look finished: a SaaS, a dashboard, a marketplace, or a website. If you already use shadcn, it drops straight in.
Is it a subscription?
No. You pay once and keep it, along with every update that ships after you buy.
What’s in Pro?
Everything Detent sells: the Pro components, the Pro blocks and the Detent app template, plus every one we add. One price, once.
Will it match my design?
Installed with shadcn, Detent takes on your theme: your primary becomes its accent, it uses your background, borders and muted text, and .dark turns it dark. Your fonts stay yours.
How do I install Pro?
With the shadcn CLI, from Detent’s private registry. Sign in with your email, generate a key, add it and the registry to the project once, as in Set up once below, then install like anything else: npx shadcn add @detent-pro/glyph. The source lands in your project.
Can my team share one licence?
A licence is for one person, so each person building with it needs their own. Your keys work in CI and shared repos.
Can I use it for client work?
Yes, in as many projects as you like, commercial ones included. What you can’t do is resell or redistribute the components themselves.
Do the free components stay free?
Yes. Everything free stays free, and keeps getting better alongside Pro.
What if it’s not right for me?
Try up to 10 components in your first 14 days. If it isn’t right, email us and you get every cent back, no form, no questions.
Set up once.Then it’s just shadcn.
Pro installs from a private registry with the shadcn CLI. Two files in your project, then add anything by name.
- 1
Add the registry
Tell the shadcn CLI where Detent Pro lives and how to sign in to it. It goes beside what shadcn already wrote there.
components.json{ "registries": { "@detent-pro": { "url": "https://detentui.com/r/pro/{name}.json", "headers": { "Authorization": "Bearer ${DETENT_PRO_KEY}" } } } } - 2
Add your key
Sign in at /account with the email you bought with and generate a key. Keep it out of git: put it in .env.local here, and give CI and your host the same variable.
.env.localDETENT_PRO_KEY=dtnt_your-key
- 3
Install anything
Components, blocks and the template by name, the template as template-detent. The source lands in your project, yours to change.
shadcn add @detent-pro/glyph - 4
Respect reduced motion
Wrap your app in this once, around everything in your root layout. For anyone who asks their device for less motion, things stop moving and fades stay.
app/layout.tsximport { MotionConfig } from 'motion/react' <MotionConfig reducedMotion="user">{children}</MotionConfig>
If it says no
- “Needs your key”
- The key isn’t reaching it. Check .env.local has DETENT_PRO_KEY, and that the header in components.json reads it.
- “That key isn’t one of ours”
- It may have been removed. Generate a new one in your account.
- “No Pro purchase on this email yet”
- Sign in with the address on your receipt. Bought with another one? Write to us and we’ll move it.
- “Couldn’t check your key just now”
- Try again in a minute.
Everything in Pro, today.One payment, yours for good.
One payment · Every update for life · Unlimited projects