A pricing plan component that displays the features, pricing, and a call-to-action button for different subscription types, such as basic or popular plans.
Starter
Basic Plan
High Performance
Unlimited Storage
24/7 Customer Support
Easy Integration
19.99€/ month
Dependencies
react-iconsInstallation
npm install react-iconsProps
| Name | Type | Default | Description |
|---|---|---|---|
| type | 'basic' | 'popular' | basic | The type of the pricing plan. "basic" for a standard plan or "popular" for a highlighted plan. |
| title | string | Basic Plan | The title of the pricing plan (e.g., "Basic Plan"). |
| label | string | Starter | The label of the pricing plan, such as "Starter" or "Premium". |
| price | number | 19.99 | The price of the plan, displayed as a number with currency formatting. |
| features | ProfPricingFeature[] | An array of feature objects that describe the plan's features, each containing a "text" field. | |
| onStart | () => void | A callback function that is triggered when the "Start now" button is clicked. | |
| className | string | Additional custom CSS classes to apply to the component. |