November 8, 2026

One Design System Across Several Brands or Websites

Explore how real design systems serve several brands, what they share, what can vary, and which questions to ask before approving a shared website system.

Three sign-in cards in a metal stand on a purple background, each with the same fields and a Continue button but different colors and typefaces: blue, pink, and black.
In this guide

Your company runs several brands, each with its own website. One leadership meeting asks why every site has its own buttons, forms, and checkout. The next asks how a shared system could possibly respect what makes each brand different.

Both concerns are fair. A multi-brand design system is one set of shared decisions, reusable parts, and guidance that several brands build from, with defined places where each brand may differ. A shared design system can cut repeated work and keep common tasks working the same way. Pushed too far, it can also flatten brands that customers are supposed to tell apart. The job is to decide, deliberately, what stays shared, what each brand may change, and which exceptions are worth their cost.

The Short Answer

  • Share what customers do. Common tasks, the parts that support them, and how those parts behave are the strongest candidates for sharing.
  • Let brands differ where customers notice the brand. Color, typefaces, imagery, and distinctive content are where the companies below let brands differ.
  • Test layout across brands. Different fonts, word lengths, and languages change how much space a part needs.
  • Treat shape as a decision, not a rule. Corners can vary by brand, but Westpac’s GEL and WARP keep corner radius the same across their brands.
  • Name the owner of every exception. An undocumented one-off is where shared systems drift apart.

Westpac: Shared Structure, Distinct Brand Expression

Westpac Group’s GEL design system serves four Australian banking brands: Westpac, St.George, Bank of Melbourne, and BankSA. Its multi-brand article describes four shared foundations: color, typography, iconography, and layout. The icon library is shared by all the brands.

What differs is how each brand looks. The system’s current published token files, checked on November 8, 2026, give the same color roles different values for each bank, such as a red primary color for St.George and an orange-red one for Bank of Melbourne. They also name a different brand typeface for St.George, Bank of Melbourne, and BankSA.

What stays the same may surprise you. In those same files, every corner-radius token, the named setting for how rounded corners are, has the same values for all four brands. GEL’s own guidance says its components use fixed radius tokens that “must not be changed or overridden.”

GEL also separates styled interface content from what it calls an embellishment layer: bespoke graphics, animations, and brand moments. That gives each brand room for personality without redesigning every form and menu.

On November 8, 2026, the public St.George and Bank of Melbourne home pages, viewed at one desktop screen size of 1920 by 1072, shared the header structure, menu labels, and hero layout. They differed in color, imagery, and headline style, and their product sections were not identical. A visual comparison like this shows how the sites look. It does not prove which code or tokens built them.

Vend: Same Components, Different Brand Fonts and Colors

WARP is the design system for Vend’s online marketplaces. Its token documentation lists FINN, Tori, DBA, and Blocket as live brands on the web, with others still to come.

WARP’s published brand files, checked on November 8, 2026, differ in font family and color. Tori, for example, maps its main button to red while the others use blue. The corner radius and type-size scales are identical across all four brands.

WARP’s multi-brand design guidance also documents a practical trade-off. Differences in typography, spacing, and language can change component sizes and break rigid layouts. So a design approved with one brand’s content may not fit another brand’s.

That is the lesson for anyone signing off a shared component. Ask to see it with each brand’s font, real content, and at phone size, not only in the brand that looks best.

News UK: Share the Behavior, Not One Layout

News UK built NewsKit to serve brands including The Times, The Sun, and its radio stations. In a July 2022 retrospective, News UK’s Nick Dorman describes how its audio player was adopted across several brands.

The first version prescribed one layout, and it did not suit every station. Virgin Radio, for example, needed extra space on small phone screens. Dorman writes that the team realized a prescriptive layout “was never going to serve the needs of all our consumers.”

The team shared the player’s underlying behavior and smaller parts instead. NewsKit’s current audio player documentation describes a shared core that manages playback, with parts that can be arranged as a full, inline, or card player.

The documentation also notes that focus order depends on how those parts are arranged. In other words, sharing a component does not certify the finished page. Each brand still has to check the version it builds.

SEEK: Sometimes the Goal Is Convergence

Not every portfolio wants more difference. A product design lead’s project account describes how, between 2019 and 2021, SEEK unified job-seeker websites for SEEK, JobStreet, and JobsDB on its in-house Braid design system. The approach favored common solutions and customized only when necessary.

A later Braid change, merged in 2023, explains a maintenance lesson. Components had picked their own corner sizes, which made theme-wide radius changes inconsistent. Aligning them to one scale restored the ability to change shape across a theme.

What About Sharp Corners for Luxury Brands?

You may hear that luxury brands should use sharp corners and friendlier brands should use rounder ones. Shape can carry brand character, and a shared system can support different radius scales per brand. WARP’s guidance lists border radius among the properties a brand switch can change, and Braid’s change was about keeping that possible.

We did not find a published, verified pair of brands that proves the luxury rule. In Westpac’s GEL and WARP, the brand difference is carried by color and type, while radius stays the same. If your brands do need different shapes, treat it as a brand decision with a stated reason, and check it on real content. Large corners can clip content in small, busy containers.

How to Decide What to Share

Build a simple decision map with your design leads. For each area, write what is shared, what may vary by brand, and who approves exceptions.

  • Common tasks and components. Usually shared: sign-in, forms, search, checkout behavior. Often brand-specific: wording and imagery. Ask: Do customers do the same task on every brand?
  • Brand expression. Usually shared: color roles and type roles. Often brand-specific: color values, typefaces, illustration, campaign moments. Ask: Does each difference support how customers recognize the brand?
  • Layout and density. Usually shared: grid and spacing scale. Often brand-specific: content amount and language. Ask: Does the shared part fit every brand’s real content on a phone?
  • Shape. Usually shared: radius scale and where it applies. Often brand-specific: radius values, if justified. Ask: What brand reason supports a different shape?
  • Accessibility. Usually shared: accessibility requirements. Often brand-specific: checks after theming. Ask: What must each brand verify after it changes colors or layout?
  • Exceptions. Usually shared: how exceptions are recorded. Often brand-specific: one-off brand needs. Ask: Who owns this exception, and when is it reviewed?

What to Ask Before You Approve

Bring these questions to the next portfolio design review:

  1. Which customer tasks are the same across our brands, and are they built from shared parts?
  2. Which visual properties can each brand change, and which are locked?
  3. Have we seen each shared component with every brand’s fonts, content, and languages?
  4. Which differences have a stated brand reason, and which are history?
  5. Who owns each exception, and how will updates reach every brand?

A shared system works best when it removes repeated work from tasks customers share and leaves brands free where customers notice them. The decision map makes that line visible, so leaders can debate it once instead of on every project.