Ledger — Free Fintech & Mobile Banking Website Template
Ledger is a free, single-page fintech and mobile-banking landing template built in plain Bootstrap 5 and vanilla JavaScript. Its standout is a phone mockup built entirely in CSS — notch, status bar and live balance UI wrap your own app screenshot, so you swap one image and never touch a photo editor. A deep-evergreen and ledger-gold palette with monospace figures makes it read as trustworthy rather than trendy.
Key features
- CSS-built phone frame with notch, status bar and live balance UI
- Drops your own app screenshot in — no image editing needed
- Animated trust-stat counters that count up on scroll
- Three-tier pricing block with a monthly to annual toggle
- Security section with feature list and floating encryption badge
- Testimonials collapse into a snap-scrolling slider on mobile
- Full-bleed CTA band with front-end email validation
- Hand-drawn inline SVG icons — no icon fonts, CSP-safe
- Scroll-reveal, sticky glass header, reduced-motion support
Best for
- Mobile-banking and fintech app launches
- A single-product finance or payments landing page
- Startups needing a trustworthy app download page
- Anyone showcasing an app screenshot in context
At a glance
- Framework: Bootstrap 5
- License: Free for personal and commercial use
- Pages: 1
- Responsive: Yes
- Style: Deep evergreen fintech with a ledger-gold accent and monospace figures
How to use it
Download the ZIP, unzip it, and open index.html — no build step, nothing to install. Edit the text and images, point any forms at your backend or a form service, and deploy the folder to any static host. Colours and fonts live in css/style.css; the interactions are in js/main.js.
Frequently asked questions
Is Ledger really free to use commercially?
Yes. You can use Ledger for personal and commercial projects, including client work, at no cost. An attribution link back to uiCookies is appreciated but not required. There is no paid tier or license fee to unlock anything.
Do I need a build step, npm, or a framework?
No. Ledger is static HTML with one CSS file, one JS file and self-hosted Bootstrap 5. Just open index.html in a browser, or drop the folder onto any host, and it works. There is no compile step, package install, or build tool to learn.
How do I swap the app screenshot in the phone mockup?
Replace img/app-screen.jpg with your own screenshot, portrait and roughly 800×1200. The CSS phone frame, notch and balance UI sit on top of the image, so any tall screenshot drops straight in. This is the template's signature feature and the reason you never need a photo editor.
Can I change the colours and fonts without coding?
The deep-evergreen and ledger-gold palette lives as CSS variables at the top of the stylesheet, so a few edits recolour the whole page. Fonts are Bricolage Grotesque, Hanken Grotesk and DM Mono, loaded from Google Fonts and easy to swap in the same file. Light familiarity with CSS helps, but you won't touch any JavaScript to restyle it.
Is it responsive and mobile-friendly?
Yes, it's fully responsive and built mobile-first on Bootstrap 5. On small screens the testimonial cards collapse into a snap-scrolling, dot-navigated slider, and the layout reflows cleanly down to phone widths. The phone mockup and pricing block adapt to every breakpoint.
Do the pricing toggle and stat counters actually work?
Yes. The three-tier pricing block has a working monthly-to-annual switch that rewrites the displayed prices in vanilla JavaScript, no jQuery involved. The trust-stat counters animate and count up when they scroll into view, with support for prefixes, suffixes and decimals. Both respect prefers-reduced-motion for accessibility.
Can I wire up the email and download buttons to a real backend?
The CTA band includes an email field with front-end validation only, plus App Store and Google Play buttons that you point at your own app links. Ledger is a static front end, so it does not send email, process signups, or handle payments on its own. You connect the form to your own service or newsletter endpoint.
Are there external dependencies, trackers, or analytics?
The only external dependency is Google Fonts loaded from Google's CDN. Bootstrap 5 and all JavaScript are self-hosted, and the icons are inline SVG rather than an icon font, so the template is CSP-safe. There are no analytics scripts or third-party trackers included.
