Components

Pricing Table

Pro

A pricing section with a billing toggle, prices that roll when you switch, and a highlighted popular tier.

Starter

$9/mo

For solo makers shipping their first project.

  • 1 project
  • Community support
  • Basic analytics
  • 1 GB storage

Pro

Most popular
$29/mo

For professionals who need more power and polish.

  • Unlimited projects
  • Priority support
  • Advanced analytics
  • 100 GB storage
  • Custom domains

Team

$79/mo

For teams collaborating on serious products.

  • Everything in Pro
  • Unlimited members
  • SSO & audit logs
  • 1 TB storage
  • Dedicated success manager

Installation

ProRequires a Planes Pro license.
npx shadcn add @useplanes/pricing-table

Unlock with Planes Pro

$99 once · 80 Pro components · lifetime updates.

I have a licenseGet Pro
<PricingTable
  onSelect={(tierId, billing) => checkout(tierId, billing)}
/>

// or with your own tiers:
<PricingTable
  tiers={[
    { id: "starter", name: "Starter", monthly: 9, yearly: 90, description: "For individuals", features: ["1 project", "Email support"] },
    { id: "pro", name: "Pro", monthly: 29, yearly: 290, description: "For teams", features: ["Unlimited projects", "Priority support"], highlighted: true },
  ]}
/>

Use cases

  • SaaS pricing pages

    The full pricing section — toggle, price rolls, popular tier — in one drop-in.

  • Plan upgrade modals

    In-app upsell surfaces that match your marketing site.

  • Agency packages

    Service tiers with feature comparisons.

  • API pricing

    Usage-tier presentation with annual-discount emphasis.