Stash · save more, spend better

Personal savings + expense tracking for individuals. Mobile-first. Dark by default. Inspired by Copilot Money. Built so that the everyday person — high school plus — can keep a clear, supportive eye on their money without jargon.

Portal · New 2 shells 20 screens Dark default /portals/stash

Full-app demo

Run the complete Stash app

All 20 screens wired up. Sign in with a 6-digit code, link a bank, set a budget, start a savings goal, watch where your money goes. Demo creds: chipo@stash.app · any 6-digit code.

Open the live Stash app Chipo Mutasa · personal finance · CBZ + Stanbic + FNB. Track every spend, set budgets, save toward goals. Launch Open in fullscreen preview

Modules

What's inside Stash

Ten modules covering the full personal-finance loop — see your money, plan it, save it, and learn from it.

01 · HOMEHome dashboardNet worth, spending this month, cash on hand. Recent transactions, goal in focus, what changed.Open → 02 · MONEYTransactionsEvery spend and income, grouped by day, filterable by type, searchable by merchant.Open → 03 · MONEYAccountsBanks, cards, investments and cash — grouped by type, each with a 7-day sparkline.Open → 04 · MONEYBudgetsSet monthly caps per category. See progress, days left, and projected over/under.Open → 05 · MONEYSubscriptionsCatch every recurring charge. See monthly + yearly totals. Set cancel reminders.Open → 06 · MONEYSavings goalsTrack what you're saving for. Auto-contribute, round-ups, and contribution timelines.Open → 07 · INSIGHTSInsightsWhere it goes. Donut by category, bars by day-of-week, cumulative velocity line.Open → 08 · INSIGHTSCashflow calendarMonthly grid with in/out dots per day. Tap a day to see its transactions.Open → 09 · INSIGHTSCategoriesManage how Stash groups your spending. Rename, recolor, merge, add custom.Open → 10 · YOUSettings & billingSecurity, notification preferences, linked accounts, plan + payment.Open →

Shells

Device shells

Stash is mobile-first. A bottom-tab shell drives the phone; a left-sidebar shell takes over at desktop.

Mobile

360–414 px

Primary

Bottom-tab shell — Home · Money · Insights · More. Detail views open as bottom sheets. Safe-area aware. Pull to refresh.

Desktop

1024 px+

Left-sidebar shell. Same screens; better for managing categories, browsing long lists, and reviewing insights.

Pages

Every screen in the demo

Each route in the single-page demo. Click to jump straight there.

01 · AUTHSign in (2FA)Email + OTP using AuthShell + InputOtp.Open → 02 · AUTHOnboarding4-step wizard with p-stepper.Open → 03 · HOMEHomeHero stats, recent transactions, goal card.Open → 04 · MONEYTransactionsSticky day headers, filter chips, search.Open → 05 · MONEYAccountsGrouped by type with sparklines.Open → 06 · MONEYAccount detail90-day trend chart + recent activity.Open → 07 · MONEYAdd account50+ banks → OAuth → success.Open → 08 · MONEYBudgetsProgress bars + projected over/under.Open → 09 · MONEYBudget detailDonut breakdown + transaction list.Open → 10 · MONEYSubscriptionsRecurring charges + cancel reminders.Open → 11 · MONEYGoalsRing progress + ETA at current pace.Open → 12 · MONEYGoal detailContribution timeline + boost sheet.Open → 13 · INSIGHTSInsightsRange chips, donut, day-of-week bars, velocity line.Open → 14 · INSIGHTSCashflowMonthly calendar with in/out dots.Open → 15 · INSIGHTSCategoriesRename, recolor, merge, add custom + p-save-bar.Open → 16 · YOUProfileName, email, phone, devices, activity.Open → 17 · YOUSettingsSecurity, notifications matrix, linked, privacy, help, about.Open → 18 · YOUPlan & billingFree / Pro / Family + invoices + payment.Open → 19 · YOUNotificationsGrouped inbox of toast history.Open → 20 · SHEETTransaction detailSplit, recategorize, note, hide, photo upload.Open →

Used in this kit

Components, blocks & patterns

Stash composes from the same system as every other portal — no bespoke component CSS.

BLStat heroNet worth lead + spending and cash secondaries.Docs → BLRow cardEvery list row — transactions, accounts, budgets, subs, goals.Docs → BLBottom tabs4 tabs: Home · Money · Insights · More.Docs → BLFilter chipsSticky filter rows on Transactions and Insights.Docs → XBottom sheetEvery detail view on phone — 95vh, sticky head + foot.Docs → PStepperThe 4-step onboarding wizard.Docs → PInput OTP6-digit security code on sign-in.Docs → PSave barSlides up on Categories when there are unsaved edits.Docs → PAlert (tones)tone-success on Home, tone-warn on sub cancel.Docs →

Built from these recipes

Cookbook recipes Stash uses

Every flow in Stash is built from a Huchu cookbook recipe.

AUTHSign in with 2FAEmail + 6-digit OTP entry.Open recipe → SHELLSMobile bottom-tab shellHome / Money / Insights / More.Open recipe → FORMSMulti-step wizardThe 4-step onboarding.Open recipe → LISTSGrouped by dateTransactions, with sticky day headers.Open recipe → CHARTSDonutCategory breakdown on Insights and Budget detail.Open recipe → CHARTSSparkline7-day account balance in the row.Open recipe → CHARTSVertical barsSpending by day of week.Open recipe → CHARTSSingle-series lineSpending velocity on Insights.Open recipe → CHARTSProgress ringGoal progress.Open recipe → STATESEmpty / loading / errorFriendly empty states on every list.Open recipe → SETTINGSNotification preferencesPer-event-type channel matrix.Open recipe →

Stash is dark by default

The whole portal uses body.is-dark so the standard token cascade flips. Every block reuses the design-system primitives — Stash adds only a portal-local palette inside portals/stash/demo.html.

All portal shells