The Pricing Card module helps you display multiple pricing plans in a clean, user-friendly layout. Each card includes customizable fields like title, description, price, billing frequency, and a feature list. You can also highlight a plan as “Recommended” using a checkbox, which adds a badge and border for emphasis. With flexible styling options, you can align the design with your brand and guide users toward the best plan.
Customizable Content: Easily define titles, descriptions, pricing, and feature lists for each pricing card.
Easily define titles, descriptions, pricing, and feature lists for each pricing card.
- Title: Name of the plan (e.g., Pro, No Brainer, No Brainer+)
- Description: Brief summary of who the plan is best for
- Currency & Amount: Define the price and currency (e.g., $45 per month)
- Billing Frequency: Display whether it’s billed monthly, annually, etc.
- Feature List: Add multiple features—each rendered as a bullet point
Styling Options: Adjust padding, icon colors, and borders to match your brand’s visual style.
- Adjust padding and margins for internal spacing
- Customize icon color for feature list items
- Set the border color for the recommended plan to differentiate it
- Control visibility of the “Recommended” badge via a checkbox
Highlight Recommended Plan: Draw attention to a specific plan using a “Recommended” badge and highlighted border.
When you check the “Show Recommended Plan” option:
- A badge labeled “Recommended” appears
- The card is visually emphasized with a highlighted border
- Helps guide users toward the most popular or best-value option
Preview: Pricing Card Module Layout: See how a completed pricing card layout appears with real-world examples.
This layout highlights the selected "Recommended" plan with a badge and a distinct border to draw user attention. Each plan showcases its features in bullet points, with clearly labeled pricing and descriptions.
