# Marketing Pricing Compare

Pricing page feature comparison table with all plans side by side and checkmarks.

- id: `marketing-pricing-compare`
- Page: https://agentic-ui-kit.com/components/marketing-pricing-compare
- Live preview: https://agentic-ui-kit.com/live/component/marketing-pricing-compare?piece=marketing-pricing-compare

## Install

```bash
agentic-ui add marketing-pricing-compare
npx shadcn@4.17.0 add @agentic-ui/marketing-pricing-compare
```

## Metadata

- **Level:** block
- **Category:** block
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** feature-matrix, comparison-table, plan-headers, grouped-rows, highlighted-plan, mobile-plan-switch, icon-cells, dark-mode
- **Intents:** explore-detail, execute-flow
- **Suits domains:** marketing, saas, billing, devtools, analytics
- **Interaction:** read-only, select, click
- **Screen role:** detail
- **Density:** comfortable
- **Dark mode:** yes
- **Use it for:** pricing page feature comparison table with all plans side by side and checkmarks, compare plans matrix below the pricing cards with grouped features, plan feature matrix that switches to one plan at a time on mobile
- **Avoid when:** only plan cards with a billing toggle are needed (use marketing-pricing), a single plan (use marketing-pricing-single), in-app plan changes for signed-in customers (use billing blocks)
- **Preserve when adapting:** table-semantics, mobile-switch
- **Replace when adapting:** plans, groups, copy
- **Adaptation effort:** low
- **Coupling:** low
- **Quality breakdown:** visual 9/10, responsive 9/10, accessibility 9/10, code 9/10
- **Uses primitives:** button
- **npm dependencies:** lucide-react
- **npm dependencies (registry):** lucide-react@0.577.0
- **Registry dependencies:** lib-primitives