Upgrade Prompt

Upgrade prompt card with a title, a short description of what the paid plan unlocks and an Upgrade button. Place it where a free user hits a gated feature.

src/registry/ui/upgrade-prompt.tsx/r/upgrade-prompt.json

Unlock Premium moments

Keep free product UI. Soft-gate kinetic heroes when the first screen has to convert.

Prompt

Installation#

bash
npx shadcn@latest add @minidev/upgrade-prompt

MiniDev UI is in the shadcn registry directory, so the short form works with no setup. Older CLI versions can use the full URL: npx shadcn@latest add https://ui.minidev.pro/r/upgrade-prompt.json

Usage#

tsx
import { UpgradePrompt } from "@/components/ui/upgrade-prompt"

export function Example() {
  return (
    <UpgradePrompt />
  )
}

API reference#

UpgradePrompt props
PropTypeDefault
titlestring"Unlock Premium moments"
descriptionstring"Keep free product UI. Soft-gate kine...
classNamestring-

Dependencies#

npm

React only

Built from

Examples#

All pricing and billing components