Improve usability of variables popup

Variables are incredibly powerful and enjoyable to work with. It’s astonishing how swiftly flexible designs with multiple themes can be created. However, the variables pop-up is challenging to work with. It appears to have been designed in Figma and implemented by the dev-team “as specified.”

Converting a complex theme with tens or hundreds of nested style-colors feels like torture:

  • The pop-up should be resizable. The narrow column width for multiple modes will make links unreadable.
  • The color pop-up should remember which tab was changed from “Custom” to “Library.”
  • It would be excellent if color-styles could be dragged from the Local-Styles list in the inspector into the variables pop-up.
1 Like

Hi there, thanks for your feedback on Variables. We’ll pass it along to our team for consideration. In the meantime, I switched your topic as “Share an idea” so the community (and yourself) can vote up! Thank you.

Wider columns for variable names is an absolute must, the current width is a problem when using most common design token naming conventions as quickly identifying which variable is which when the name is truncated can be difficult.

EDIT: I’d love to see better support for longer token names in the panel where you select variables for an element as well.