Asymmetric three-column pricing with an elevated featured card, amber badge, and optional security footer.
Requires shadcn button and badge (uses the amber variant on the featured plan).
Asymmetric three-column layout: hobby, elevated featured center, and enterprise. Set customPricing to swap the price row for a label, and footerNote for a security row under the featured card. Inspired by Efferd Pricing 6.
| Prop | Type | Default |
|---|---|---|
plansPlan objects with price or customPricing, features, CTA, featured flag, and optional footerNote. | Plan3[] | DEFAULT_PLANS_3 |
titleSection heading. | string | "Flexible plans that grow with you" |
subtitleSubtitle opposite the heading. | string | DEFAULT_PRICING_3_SUBTITLE |
classNameClasses on the root container. | string | — |
Click on the icon in the top right of the example preview to view the source code for specific variants.
This component is inspired by various open-source projects and patterns. Please verify licenses and implementation details before using in production.
Use Inbox individually or upgrade to link more accounts and add seats for your team members.
For most individuals
For small businesses
For large organizations
import { Pricing003 } from "@/components/ui/pricing-003"export default function Page() {
return <Pricing003 />
}