White Label Design System & Figma Tokens

342 Views Asked by At

Has anyone created a white label design system and found a way to witch style guides or libraries each time a new client is onboarded and update all screens with their brand colors, logo etc? I want to use one library of components for different brands which have their primary colors, typography, rounded corners, etc.

The solution I've found for a white-label app is to create an unbranded design system and then duplicate this file, change it for each brand with their styles and basically have a new design system for each brand.

Thanks for your help!

1

There are 1 best solutions below

1
On

If you have access to Token Studio for Figma (PRO) you can create multidimensional themes.

-- OR --

If you have an enterprise figma account you can create figma variables, map your variables to your components. In the variables window, you can create another "mode"-- use that column to designate the values for your second theme. figma variables window shows two modes

On the right sidebar, under the "Page" section you can change the variable mode to view.

Figma page option to view or change variable mmodes.

As mentioned in Figma's article on Modes for Variables....

  • Anyone on Education, Professional, Organization, and Enterprise plans can create and use modes for variables.

  • The number of modes you can create per variable collection depends on your plan