code-anything.com
Log inStart free

Dashboard

Ledgr

Ledgr is a focused finance and banking dashboard built around money you can read at a glance. A deep emerald-ink canvas with raised panels, a mint primary accent and a warm gold for spend keeps numbers honest and scannable, while monospaced tabular figures align every balance, delta and amount. It ships the full money story — overview balance, account and budget cards, an inline cash-flow area chart, a category-spend donut and a recent-transactions table with signed amounts.

Trustworthy, precise and quietly premium — a private bank after dark.

finance-dashboard.code-anything.app

Overview

All accounts · June 2026
Transfer
TOTAL BALANCEAS OF 06/28 · 09:41
$28,940.16
▲ +$1,204.80+4.3% this month
EVERYDAY CHECKING
$8,412.55
•••• 4291
▲ +$320.10
HIGH-YIELD SAVINGS
$18,902.00
4.30% APY
▲ +$642.70
JUNE BUDGET
$1,712.40
$2,400 limit
71% used
CASH FLOW · 12 WEEKS
+$3,612 net
Net flow
SPEND · BY CATEGORY
Housing$1180
Groceries$540
Transport$320
Dining$260
Other$190
Recent transactions7 this week
View all
MERCHANTCATEGORYDATEAMOUNT
GGreenfield GrocersGroceriesJun 27−$84.20
PPayroll · Northwind LabsIncomeJun 26+$4,250.00
HHarbor Coffee Co.DiningJun 25−$6.75
LLumen EnergyUtilitiesJun 24−$132.40
TTransfer to SavingsTransferJun 23−$500.00
MMeridian TransitTransportJun 22−$42.50
AAtlas RefundIncomeJun 21+$38.99

Design rules

The system, applied to any site

Every rule below travels with the template — describe your tweaks and the agent keeps the system intact.

What it decides for you

  • Build on the deep emerald-ink canvas (#071512) with raised panels (#0e201b) so every card floats; keep money on calm surfaces, never on busy gradients.
  • Reserve mint (#34d399) for the brand, positive deltas and money-in, and warm gold (#fbbf24) for spend, budgets and money-out — colour carries the sign so figures read at a glance.
  • Set all balances, amounts and deltas in a monospaced face with tabular-nums and an explicit + or − so columns align and credits read apart from debits.
  • Lead with one hero number: an oversized current balance with its change beneath, then taper down to account cards, charts and the ledger so the eye flows from total to detail.
  • Separate dense regions with hairline 1px borders (#173028) and generous 14px radii instead of heavy shadows; keep micro-labels uppercase and tracked for context above each figure.
  • Give every transaction a category pill, a merchant, a date and a signed amount on one tidy row so the ledger scans like a real statement.

Ships with

Sidebar nav + account switcherBalance / overview headerAccount & budget cardsCash-flow area chartCategory-spend donutRecent transactions table

Design tokens

Palette

bg
surface
text
muted
accent
accent2
border

Headings

Inter

Body

Inter

Radius

14px

Explore palettes

Keep looking

More from the library

AuroraMarketing
Warm ArtisanMarketing
Sharp FadeBooking
CockpitDashboard

Make it yours in minutes.

Start from this template and describe your tweaks — content, sections, colours. The backend and deploy are handled.