Pricing Cards
A three-tier pricing layout with a highlighted middle tier, hover lift, and popular badge.
Starter
$0/mo
For side projects and prototypes.
- 5 components/mo
- Community support
- Basic themes
Most Popular
Pro
$29/mo
For teams shipping real products.
- Unlimited components
- Priority support
- All pro themes
- Figma files
Enterprise
$99/mo
For scaled orgs with custom needs.
- Everything in Pro
- SSO & audit logs
- Dedicated Slack channel
Usage: paste this file into your project (e.g.
components/pricing-cards.tsx), make sure framer-motion, clsx and tailwind-merge are installed, and add the cn() helper from the docs.