Florin — fintech dashboard
A complete banking product, not a single screen: 16 interconnected views sharing one app shell, realistic data, working modals and filters. Built with Astro on top of the Veritheme CSS package — the same tokens and components documented on this site.
Zip contains the full Astro project (v1.0.0, updated 2026-08-20) — unzip, then npm install and npm run dev.
Live re-theming
Every screen restyles itself — fonts, radii, colors — by switching one data-theme attribute. No rebuild.
Real dark mode
Dark follows the OS or an explicit choice, with the surface hierarchy the design system prescribes.
Responsive shell
One app shell: collapsible sidebar on desktop, off-canvas drawer on mobile, shared by all 16 screens.
No lock-in
Astro pages plus the veritheme CSS package. No UI framework, no CSS-in-JS, no build-time magic to unpick.
One template, every theme
The floating toolbar in the demo swaps Veritheme presets live. Nothing in the markup changes — only the tokens behind it. Build your own preset in the theme generator and drop it in.
All 16 screens
Each one opens in the live demo, where the sidebar, search, modals and filters actually work.
Banking
Money movement
Account
Start from it
Download the zip, or clone the repo. Florin pulls Veritheme from npm, so updating the design system is a version bump — your screens stay untouched.
git clone https://github.com/tarasenko-by/florin.git cd florin npm install npm run dev # http://localhost:4321 → Overview npm run build # static site in dist/
Astro 7 · veritheme ^1.0.0 from npm · MIT licence · photos hot-linked from Unsplash, no binary assets.