Cobalune — Fintech & Digital Banking HTML Template

Cobalune is a premium HTML template for fintech products: money apps, digital banks, card programmes, savings and investing products, and business banking. It ships five genuinely different homepage layouts and fourteen inner pages in hand-written HTML, CSS and one JavaScript file.

Five homepage layouts

• Glass Card: a rounded sky window over a lakeside skyline, a lit glass bank card that tilts toward the pointer, live transaction toasts, then the four money habits as tabs and a bento of small features with a working freeze-card switch.
• Statement: the page is an account statement. Lines are grouped by day with a correct running balance, and six of them unfold into the feature behind the payment. Period switch, category donut and a working CSV export.
• Calculator: no hero photograph, just a savings calculator first. Starting amount, monthly deposit, years and plan produce the final balance and interest with an animated chart, and the result can be shared by link.
• Phone Story: one phone stays in place while five chapters scroll past, and its screen, built in HTML rather than screenshots, changes with each chapter.
• Vault: a night-blue page about keeping money safe, with a vault-door hero, five nested layers of protection and a card designer (finish, name on card and plan).

Fourteen inner pages

• Personal and Business accounts, with an invoice preview and team cards with per-person spending limits
• Cards with a card switcher, and Pricing with a monthly/yearly toggle and a full fee and limits table
• Security with a fraud-response timeline, and Invest with a portfolio projection planner
• Get the app, About, Careers with role filters, Journal, a long-form Article, a searchable Help centre, Contact and 404

What makes it worth paying for

• Interactions that do real maths. The savings calculator, investing planner, running balances and pricing toggle all calculate correctly and keep their state in the URL.
• A working contact form. One PHP file with server-side validation, a honeypot, a time trap, a per-IP rate limit and mail-header-injection guards. Change one line to set the recipient.
• One hue, one token file. Every colour, size and duration lives in tokens.css, and the whole template is drawn in a single blue ramp, so re-branding is a handful of lines.
• Accessible by construction. Skip link, one h1 per page, landmarks, visible focus, keyboard-operable tabs, menus, accordions and switches, and prefers-reduced-motion honoured throughout.
• No layout shift. Every image carries explicit dimensions and a responsive srcset.
• Full buyer documentation as a styled HTML site, including a section on financial copy and disclosures.

Built plainly

Nineteen HTML files, ten stylesheets and one dependency-free JavaScript file. No framework, no build step, no jQuery, no chart library and no icon font. Open index.html by double-clicking it.

Design

One blue at every value, from ice to cobalt to a deep ink, with no grey and no black. It is set on a hazy sky with frosted-glass surfaces and a lit cobalt card as the recurring object. Portraits are printed as cobalt duotones. Type is Parkinsans, Commissioner and Fira Code.

Demo photographs are from Pexels and are not included in the licence. Every one is traced to its source in assets/img/CREDITS.md.