Variables Inspector

About this plugin

Using complex variables and logic in Figma, but can't find a way to debug when things don't wok as expected?

Variables Inspector will show current values of variables as an overlay on every frame. You can quickly see and isolate what is going wrong and make changes to fix them.

1. The inspector works in both design and prototype modes.
2. The inspector supports variable values with more than one mode.

Instructions

See video tutorial here: https://www.youtube.com/watch?v=jFM4NPntaaI

1. Open the desired page and run the plugin (file should contain at least one variable, no pranks please!).
2. Choose the variable collection you would like to inspect and click Show Inspector.
3. Plugin will add Inspector to all the frames in the current page, listing the variables and their current values.
4. Added Inspector is visible in prototypes as well and will update in real-time, when variable values change.
5. Go debug that pesky variable that is driving you nuts.
6. Close the plugin when you no longer need the Inspector.