Can you switch color modes via prototyping?

I believe it’s not possible to change modes through prototyping currently. Correct implementation would probably be to allow to bind layer mode to some local variable but the options is clearly not there.

It’s the first thing I tried to do in my project… Not being able to switch manually when in play prototype mode is just one aspect. When using the “Set variable interaction” on a color variable it only allows to fix another color. I was expecting to be able to set a mode change. I would have to define a large number of “Set variable” interactions but at least I would be able to prototype a dark mode switch. An even better feature would be to determine a mode change for an entire collection of variables.

I was expecting exactly the same, unfortunately color variable only allows to replace color value and not the mode. I hope Figma considers it in the upcoming release.

I’d definitely love to be able to switch color modes in prototype presentations.

It’s sad, I thought it’s already there unless I tried myself and reached here. It’s very obvious for someone to create theme modes and create interaction in prototype with switch or image toggle.

Same problem here. It’s definitely an obvious feature and it’s too bad that it’s not there 😞

Please upvote this feature here: i’d love to see this happen soon too 🙂 Dynamically change modes through prototyping interactions

I would expect this for both the prototyping mode as well as the dev mode. In prototyping mode as an option for the prototype just like hotspot hinting. But inside prototypes it would also be great to support theme switching using a system variable: e.g. systemTheme (string) = darkTheme / highContrastTheme etc.

Yes, I really need this functionality. I see the potential to develop a plugin for this (one may already exist), but it should be baked in for prototyping.

@gary_simon Sadly, there isn’t a way (yet) to switch a mode via a variable.

But you can “change to” or “navigate to” elements/frames that have different modes applied.

For example, in this file (see below) I set up a button to switch from light or dark mode. When I click it, it will “navigate to” the corresponding frame set to either a “Light” or “Dark” mode.

⮑ View Prototype
⮑ Get the File