Citrine Pricing Spectrum
An elegant dark-mode pricing section designed for fintech products.
Features
- Three pricing tiers with frosted glass card effect (backdrop-blur)
- Monthly/yearly billing toggle with animated switch
- Gold/citrine accent colors on deep charcoal background
- Center card elevated and highlighted as "Most Popular"
- Feature comparison lists with check/x indicators
- Geometric diamond shapes as background decoration
- DM Serif Display typography for an authoritative feel
- Full dark mode support
Usage
import RegistryItem from './registry-item';
export default function Page() {
return <RegistryItem />;
}
Customization
- Edit the
tiers array to change plans, pricing, and features
- Adjust gold (#EAB308) to match your brand accent
- Modify the billing toggle discount percentage
- Add or remove features per tier
