Multi Brand Design System for Banking

The problem

Every project, a new starting line

Making design changes across multiple projects sounds challenging, because each designer had their own working style. Without a shared and manageable system, every update to a button, a color, or a spacing rule had to be made manually — and sometimes things could break.

We needed something that solved two things at once: a single source of truth that could flex to fit different brand identities, without becoming so complex that it collapsed under its own weight.

The decision

What we had to figure out

Do we build one system per brand — clean, focused, but expensive to maintain? Or one shared system that scales across all of them? We explored both.

One system per brand gave each product room to breathe, but any fundamental change meant touching every file separately. This works well if one person handles one project — like Malvin doing Client Bank A, and Ikhsan doing Client Bank B. Or we build a single source of truth for design, so every design made and updated shares the same style.

"But we have main problem using the first."

— the trade-off that settled it: duplicated maintenance

So we committed to the shared system: one foundation of tokens and components, themed per brand. A fix made once propagates everywhere; a new client starts from a working product instead of a blank file.

The system

Building block by blocks

Some of the key components that will be included in the design system for Banking are:

Color Palette

A set of primary and secondary colors that will be used consistently throughout the digital products. In a multi-brand system these live as tokens — swap the theme values, and every component follows.

Illustrative token set — brand themes override the primary scale per client.

Typography

A selection of fonts and styles that will be used for headings, body text, buttons, etc. One scale, documented once, applied everywhere.

Iconography

A library of icons that will be used for various actions and features within the banking products — one stroke weight, one grid, no mixing sets.

UI Components

Custom-designed elements such as buttons, input fields, dropdowns, etc., that can be easily implemented across different platforms. The samples below are live — hover and type in them.

Outcome

One system, many brands

The result is a single source of truth for design across our banking clients: shared tokens and components underneath, each brand's identity applied as a theme on top. New projects no longer start from scratch, and updates no longer mean hunting through separate files — consistency stopped depending on who happened to design the screen.