Back to components
SaaS component
Subscription Status & Usage Meter
Current subscription plan card with status, renewal, and upgrade actions, plus usage progress bars for API, storage, or seats.
Install
$ Run in your project root
pnpm dlx shadcn@latest add https://vibekit.desishub.com/r/saas-subscription.jsonWhat it does
- Subscription plan card with status badge (active, past_due, canceled, trialing, incomplete)
- Renewal and trial end dates with contextual status messages
- Usage progress bars with automatic color thresholds (75% amber, 90% red)
- Manage and Upgrade action buttons in footer
When to use
Use it
SaaS dashboard settings pages, account management, and billing sections.
Skip it
Consumer apps without subscriptions or metered usage.