# Pricing Section Neomorphism

> Futuristic Pricing Cards — Stunning Animations with Tailwind + Lucide + React Bring your pricing section to life with this ultra-modern, animated pricing card UI, built with React, Tailwind CSS, Lucide icons, and elegant motion effects. This component is fully responsive, visually captivating, and optimized for conversion.  ✨ Features: Animated price counter: Smoothly counts up to the actual price to grab user attention.  Staggered feature reveal: Each feature slides in with a delay, creating a dynamic entrance.  Popular plan badge: A glowing “Most Popular” tag helps drive user focus.  Interactive CTA button: Hover-triggered shine and rocket animation for delightful UX.  Accent color theming: Easily switch between blue, cyan, or purple themes.  Responsive layout: Optimized grid design for mobile, tablet, and desktop.  🧠 Tech Stack: React (functional components + hooks)  Tailwind CSS (custom gradients, blurs, transitions)  Lucide Icons for crisp and scalable SVGs  CSS animations & hover effects without third-party libraries  🧩 Use Case: Perfect for SaaS products, landing pages, and any product-based website that needs a visually rich pricing section that goes beyond static layouts.  📦 Includes: Basic, Pro, and Enterprise tiers  Distinct icons, prices, features, and styles for each card  Pulsating background blurs for a futuristic vibe

- Author: [Sonu](https://21st.dev/@uniquesonu)
- License: unknown
- npm dependencies: lucide-react
- Live preview: https://21st.dev/@uniquesonu/components/pricing-section-neomorphism

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/uniquesonu/pricing-section-neomorphism?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt