Prism Analytics Comparison
A visually striking analytics platform comparison block with prismatic rainbow accents.
Features
- 3-platform comparison — Side-by-side feature matrix for InsightCore, DataPrism, and MetricFlow
- 10 feature rows — Check/cross indicators with green/red color coding
- Rainbow gradient accents — Prismatic header and divider bars from violet through red
- Highlighted column — Most popular platform with subtle violet background tint
- Pricing row — Bold price display with gradient text for featured platform
- Alternating rows — Gray-50/white alternation for readability in light mode, slate-900/dark in dark mode
- Responsive — Horizontal scroll on smaller viewports
- Dark mode — Full dark variant with #0f0f14 background
Dependencies
@/components/vue-ui/badge — Badge@/components/vue-ui/button — Button@/components/vue-ui/table — Table, TableHeader, TableBody, TableRow, TableHead, TableCell@/components/vue-ui/separator — Separatorlucide-vue-next — Check, X, ArrowRight, Sparkles
Customization
- Platforms: Edit the
platforms array for names, taglines, and prices
- Features: Modify
features array to add/remove comparison rows
- Colors: Swap gradient classes for different prismatic themes
- Font: Change the Google Font link from Manrope to your preferred typeface
