Allow developers to switch Page-level variables (e.g. Light/Dark mode)

We have a design system set up with tokens (variables) to enable all components to switch between light and dark mode.

For developers/viewers to see what a screen should look like in Dark mode, we have to duplicate that screen. But as an editor I can set the colour mode variable at the Page level to Dark and all screens on the canvas/page turn to dark mode.

If developers/viewers could also do this, I could delete the dark mode duplicates of every screen and only have one copy of each screen, defaulted to light mode, and then just toggle dark mode as needed.

This would be much more efficient on memory usage and maintenance.

7 Likes

It would be great if it could change the language too!

Yes, allowing Devs and viewers to switch the modes would be a killer feature, avoid a lot of duplicated screens.

2 Likes

Agreed. Currently inundated by developers to see both modes in the designs. Counter-productive having to physically display both ex. Dark and Light UI, when all they would need is the ability to switch and get the respective values.

2 Likes

We need this ASAP common Figma

1 Like