Free Finance UI Kit
Last Updated on July 25, 2026 by Editorial Team
I’m happy to share this awesome Finance UI kit to help you create finance & personal savings apps with it.
The .Sketch project is well-organized and contains multiple mobile screens:
- login with fingerprint
- login with a pin
- standard login
- standard login with keyboard opened
- main
- main with profile sidebar opened
- find ATM
- send money
- send money – select recipient
- send money – fingerprint authorization
- add new saving
- general stats (income / outcome / savings)
- savings stats
This free resource was crafted by Paweł Kwaśnik for 7ninjas.
Look closely at the three screens shown and you get a good sense of how this finance UI kit thinks about hierarchy.
The ATM finder screen leads with a map, a dashed route line, and a bottom card that surfaces just the essentials: bank name, distance, hours, a green “Get Directions” link.
The salary account screen puts a photorealistic debit card at the top, complete with chip, card number, and expiration date, then drops straight into a horizontal row of contact avatars for sending money and a clean transaction list below.
The statistics screen swaps all of that for a donut chart and a wavy line graph, both rendered in the same soft, flat color palette of green, blue, orange, and coral.
That consistency across very different data types, maps, cards, charts, lists, is what makes this kit worth studying even if you never open the file for a real client project.
The visual language is deliberately quiet. White and off-white backgrounds, thin dividers, a single accent green used for the floating action button and positive balances, and a muted status bar that never competes with the content.
Typography stays small and restrained, letting numbers like account balances and transaction amounts do the visual heavy lifting.
Icons are simple line-based glyphs in the bottom tab bar, and the fingerprint and pin-based login flows suggest the designer was thinking about real banking app conventions rather than a generic app mockup.
Where This Kit Fits Into Real Projects
This is a natural starting point for anyone prototyping a mobile banking app, a personal finance tracker, a savings goal app, or a peer-to-peer payment concept.
The included screens for fingerprint login, PIN entry, ATM location, money transfer, and income/outcome statistics cover most of the core flows a fintech product needs to demonstrate in a pitch deck or portfolio case study.
It also works well as a teaching reference for anyone learning how to lay out financial data. Studying how the card, the contact row, and the transaction list are spaced and weighted against each other is a fast way to absorb patterns that show up across most banking apps.
Freelancers pitching fintech clients can use it to build a quick clickable concept without starting the visual design from a blank canvas.
If you plan to adapt it, start with the color system before touching layout. Swapping the green accent for a brand color across the buttons, the chart, and the positive-balance text will do more to make the kit feel custom than any structural change.
From there, rebuild the card artwork and avatar photos with your own imagery, since those are the elements most likely to look like a template if left untouched.
Keep the spacing and type scale intact where you can. The restraint in this kit is what makes financial numbers easy to scan, and tightening things up to fit more content usually backfires in a finance context where clarity matters more than density.
Pairing suggestions are straightforward given the subject matter: a simple line-icon set for any additional menu items, a monospaced or tabular numeral font for account and card numbers if you want extra polish, and illustration-style empty states for screens like “no transactions yet” or “no savings goals set” that aren’t part of the included set but fit the same soft, rounded aesthetic.
