A flagship pricing section: canvas light-rain backdrop, rotating conic ring on the popular card, rolling-digit prices on a spring Monthly/Yearly switch, deep 3D buttons and a blur-stagger reveal.
- React
- TypeScript
- framer-motion
The most complete pricing section on the shelf — atmosphere (canvas light rain + masked grid + halo), hierarchy (a conic-ring popular card with glow) and delight (prices that roll digit-by-digit when you flip the billing period). Our own rolling-digit implementation — no @number-flow dependency. Deep Apple-style 3D buttons; one `accent` variable retints the rain, the ring, the checks and the CTAs. Blur-stagger entrance, spring pill switch with a save chip, reduced-motion safe. Three plans, responsive to a single column. Only dependency: framer-motion.
- Pricing
- SaaS
- Landing