Pocketwatch
Pocketwatch is a personal-finance app that puts budgeting, net worth, and investments in one place — “everything that moves your money, in one ledger.” I led the brand, the design system, and the product design, and built the front end; my collaborator Chris built the backend and runs the business and legal side. It’s live in production at pocketwatch.io.
- — Brand identity and a full design system
- — Product design across budgeting, net worth, and investments
- — Front end built in SvelteKit 2 / Svelte 5
- — A live subscription product with a desktop app
Category
Product & Brand Design
Year
2026
Role
Brand, Product Design & Front-End
Timeline
Ongoing
Tools
Figma, SvelteKit, Svelte 5, TypeScript, Tailwind CSS, Bits UI

Brand Identity
Pocketwatch had to feel trustworthy enough to hold someone’s entire financial life and warm enough that they’d actually open it every day — most finance apps land on one side or the other. The mark threads that needle: a friendly, slightly odd little creature built from a pocket-watch silhouette, drawn as a single confident shape and set in a soft dark squircle. It reads as approachable at app-icon size and serious in a nav bar. The wordmark is Satoshi — geometric, modern, no flourishes.
The palette is deliberately warm-neutral and nearly monochrome — near-black ink on cream — with the mark doing the heavy lifting. It’s a personality you can live with in a tool you check every morning, not a logo built to shout from a billboard.
A Design System With No Brand Color
The core design decision was to give the app no brand color at all. The chrome is intentionally quiet — a cool, neutral palette in the Linear / Stripe / Vercel register — because the moment a finance app starts coloring its own interface, it competes with the only thing that actually matters: your money. So color comes entirely from content. Every category is a pill — an emoji plus one of ten saturated hues the user picks — and those pills are the only saturated color anywhere in the UI. The interface stays calm by default and turns colorful exactly where the user made it so.
Everything routes through a single source of truth: one tokens file for type, color, spacing, and motion, consumed by Tailwind and exposed as CSS variables, with a live design-system page that re-skins the entire app from one attribute. Type is a three-font system — Satoshi for display, Inter for UI and body, JetBrains Mono for every figure, because financial numbers have to be tabular and monospaced to scan. Motion is tokenized the same way: one workhorse ease-out, a small set of named durations, and a global reduced-motion override, so the whole product moves with one restrained vocabulary instead of drifting component to component.
One Ledger for Everything
Most people run their financial life across three or four disconnected tools — a budgeting app, a banking app, a brokerage, a spreadsheet for net worth. Pocketwatch’s product thesis is that those are one picture, not four. It unifies a zero-based budget (every dollar assigned, with a Ready-to-Assign figure), a transaction ledger across cash and credit accounts, lots-based investment tracking, manual assets, and a net-worth view derived from all of it. The hard part was density without dread: it’s a lot of financial data, and it has to feel browsable, not like a tax form.
The interface borrows YNAB’s rigor but covers far more ground, and it’s built to a production standard from the first screen — every list and table designed mobile-first, every loading, empty, and error state handled, every destructive action confirmed. I designed and built the front end in SvelteKit 2 and Svelte 5, using its new runes reactivity on a component system tuned to keep dense data calm. Chris built the backend — Express, Drizzle, Postgres — and owns the business and legal side, which let each of us go deep on our half.
Live
Pocketwatch is live in production as a real subscription product — a 14-day free trial, then $5/month or $50/year through Stripe, with a desktop app alongside the web app.
Visit pocketwatch.io →Outcome
Pocketwatch is the rare personal project that’s genuinely shippable software: built security-first — every route scoped to its owner, inputs validated, sessions revocable server-side — to the standard a tool handling real money demands. What I’m proudest of is the restraint. An all-in-one finance app is exactly the kind of product that bloats into noise; Pocketwatch stays quiet and lets your own money be the only thing on screen with any color.