Graphite AI Dashboard

Graphite AI Dashboard

A futuristic AI command center dashboard for monitoring model inference and training.

Features

• Performance cards — Accuracy, latency, throughput with trend indicators and sparkline charts
• Model selector — Dropdown for switching between AI models (GPT-4o, Claude 3.5, etc.)
• Training progress — Epoch progress bar with loss, learning rate, batch size, ETA
• GPU utilization — 4-node cluster with per-GPU utilization bars, memory, and temperature
• Inference logs — 5-row table with request ID, timestamp, model, tokens, latency, status
• Status badges — Color-coded Success/Warning/Error indicators
• Graphite palette — Zinc-950 base, cyan-400/500 accents, emerald status indicators
• Space Mono + IBM Plex Sans — Monospace for data, sans-serif for headings
• Grid pattern — Subtle background grid for futuristic aesthetic
• Dark-native design — Optimized for dark mode with appropriate light mode fallbacks

Dependencies

• @/components/vue-ui/card — Card, CardHeader, CardTitle, CardContent
• @/components/vue-ui/badge — Badge
• @/components/vue-ui/table — Table, TableBody, TableCell, TableHead, TableHeader, TableRow
• @/components/vue-ui/separator — Separator
• @/components/vue-ui/button — Button
• lucide-vue-next — Brain, Cpu, Zap, Clock, Activity, Server, ChevronDown, BarChart3, Terminal, Circle, ArrowUpRight, ArrowDownRight

Customization

• Models: Edit models array and default