Changelog
Last updated on 2026-04-05
v1.0.0 -- April 5, 2026
Initial release of the Finance Dashboard Kit.
Screens (9 total)
- Customizable dashboard with 16 widgets: stat cards with sparklines, income/expense chart, spending donut, cash flow timeline, net worth chart, expense heatmap, budget progress, savings progress, asset allocation, top merchants, recent transactions, bills due, budget alerts, largest expenses, and subscriptions
- Dashboard layout presets (Full View, Minimalist, Business, Personal) with widget picker
- Transaction ledger with sortable table, search, category/account/status/amount filters, detail sheet, and add dialog
- Accounts page with net worth hero card, account list grouped by type, and add account dialog
- Budgets page with summary cards, category budget cards with progress bars and monthly history, and add budget dialog
- Bills & Subscriptions page with tabbed upcoming bills timeline, subscription grid, annual projection chart, and add bill dialog
- Savings Goals page with stats row, goal cards with progress rings, goal detail sheet, contribution modal, and create goal dialog
- Financial Reports page with tabbed overview (monthly summary cards), profit & loss table, and balance sheet table with period selectors
- Settings page with tabbed general preferences, appearance theme switcher, and data & export section
- Root page redirecting to dashboard
Features
- 6 built-in color themes (Mint Ledger, Midnight, Sunset, Emerald, Lavender, Slate) with full light and dark mode
- Dual-mode operation (Personal and Business finance)
- Command palette (Cmd+K) for quick navigation
- Floating action button for mobile quick actions
- Tabular number formatting for financial figures
- CSS animations with staggered entrance effects
- Zustand-powered widget layout persistence
Tech Stack
- Next.js 16 with App Router
- React 19
- Tailwind CSS v4 with oklch design tokens (teal hue 170)
- shadcn/ui v4 with @base-ui/react
- Recharts 3 for charts
- Zustand 5 for state management
- 5 accessibility hooks
- Light & dark mode via next-themes
- Framer Motion for transitions