SaaS
Pricing Plan
A pricing card component displaying subscription plan details with strikethrough pricing for discounts.
Overview
Enables potential customers to understand and compare subscription options through a clear card layout. Display individual tiers with respective pricing, show discounted annual pricing with strikethrough formatting, and present included features with checkmarks and excluded features with visual indicators. Supports transparent pricing presentation without hidden costs to strengthen customer confidence.
Key Business & UX Benefits
- One card for plan details and pricing so comparison is clear.
- Strikethrough and feature lists support annual discounts and inclusions.
- Localized pricing and CTA keep the card on-brand and actionable.
- Transparent presentation builds trust and reduces support.
Pro-Tip from Larry: Use Pricing Plan cards so customers can compare tiers at a glance.
Usage
LuiPricingCard
Feature List
- Strikethrough pricing for annual billing discounts
- Included and excluded feature lists with icon indicators
- Localized money formatting via the [`$money`](/frontend/api-reference/common-types/money#formatting-with-money) helper
- CTA button with customizable text and link
API Reference
No component metadata found for PricingCard. Did you mean
LuiPricingCard?