pricing page shadcn

Pricing Page made with Shadcn UI

Installation

Run this or the equivalent in npm/pnpm/yarn

• bunx shadcn-ui@latest init
• bunx shadcn-ui add dropdown-menu tabs card button
• bun i next-themes

To setup light/dark/system mode, you can follow the official dark theme guide. This pricing page should adapt automatically to the selected theme.

Features

• Dark & Light Mode
• Monthly / Yearly Plan
• Yearly Plan savings automatically calculated and highlighted
• "Popular" tag for highlighting a specific plan (PRO Plan in the live preview)
• "Exclusive" tag for highlighting a specific plan (EXCLUSIVE Plan in the dark theme live preview)

Need Help?

I provide consultations and offer development services. Email me at [email protected] if you're interested.