Skip to main content
Question

Support different scopes per variable: component-level, page-level, and global

  • July 1, 2026
  • 0 replies
  • 12 views

Richie Moon

Currently, when you set a scope for a variable (e.g., "All fills" or "Text fill"), that scope controls which properties it can be applied to, but there's no concept of visibility scope — determining where in the file a variable is accessible at all.

Two improvements would make this far more powerful:

First, property scopes should be assignable per variable within the same collection, rather than uniformly. For example, a spacing variable that applies only to gap but not to padding — giving design system authors control over where tokens can and cannot be applied.

Second, and more importantly, variables should support an accessibility scope: whether a variable is global (available everywhere in the file), page-level (only accessible within the page it's defined on), or component-level (scoped strictly to the component it belongs to, not leaking into the rest of the file). This would allow teams to define internal component tokens that don't pollute the global variable picker, while keeping shared system tokens globally accessible.

Together, these scoping controls would make Figma variables viable for managing complex, multi-layered design systems without overwhelming contributors with irrelevant tokens.