# InsuranceSummaryCard

> The InsuranceSummaryCard component is a sleek, modern, and fully configurable Shadcn UI–based card designed to display key insurance details in a clean and interactive way. It features a dynamic gradient header, animated hover effects, and smooth progress visualization to represent coverage usage. Each card can show the policy number, insured and premium amounts, expiry details, and policy type, with optional tooltips for quick explanations. Built using Framer Motion for subtle motion and Shadcn UI components for consistent styling, it fits perfectly into modern dashboards or client portals. The component is reusable across multiple insurance categories—like car, health, or travel—and can easily be customized with icons, colors, and tooltips, making it ideal for professional, data-driven insurance applications.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- npm dependencies: lucide-react, framer-motion
- Live preview: https://21st.dev/@ruixen.ui/components/insurance-summary-card

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/ruixen.ui/insurance-summary-card?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