Debug your variables in designs and prototypes. The missing DevTools for Figma variables.
https://www.figma.com/community/plugin/1355055910166329140
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. The inspector works in both design and prototype modes. You can quickly see and isolate what is going wrong and make changes to fix them.
- Open the desired page and run the plugin (file should contain at least one variable, no pranks please!).
- Choose the variable collection you would like to inspect and click Show Inspector.
- Plugin will add Inspector to all the frames in the current page, listing the variables and their current values.
- Added Inspector is visible in prototypes as well and will update in real-time, when variable values change.
- Go debug that pesky variable that is driving you nuts.
- Close the plugin when you no longer need the Inspector.