Cobalt Analytics Features
A data-forward feature showcase for analytics and data platform products.
Features
- 6-card feature grid — Each card has a unique color-coded icon and metric
- Metric pills — Inline performance stats per feature (latency, accuracy, etc.)
- Multi-color system — Blue, violet, amber, emerald, rose, cyan card accents
- Dot-pattern background — Subtle structural texture
- Gradient headline — Blue-to-purple text gradient
- Bottom CTA — Dual action buttons for trial and demo
- Dark mode — Full dark variant with deep zinc tones
Dependencies
@/components/vue-ui/badge — Shadcn-Vue Badge@/components/vue-ui/button — Shadcn-Vue Button@/components/vue-ui/card — Shadcn-Vue Card@/components/vue-ui/separator — Shadcn-Vue Separator
Customization
- Features: Edit the
features array to change icons, titles, descriptions, metrics
- Colors: Modify the
colorMap object for different accent palettes
- Layout: Switch between 2-col and 3-col by changing the grid classes
