research: testing Figma variables

[van-nguyen-ht]

Summary:

Figma variables provide a different solution to the Tokens Plugin. The idea is to provide both solutions (Sync from tokens plugin to Figma Variables) to offer multiple ways for users to get style information.

Scope of this task:

• [ ] agree on a solution
• [ ] create implementation tasks in project board

looking at Figma variables & testing how it works - in relation with Tokens Studio also

[van-nguyen-ht]

current result: -2 themes: UI Semantic & UI Semantic Dark https://www.figma.com/file/zcoQjOlyc2xA9bhxToKqpl/Test-(Variables)?type=design&node-id=2201%3A37697&mode=design&t=hxnHQ1EaEI1XL69t-1

-4 themes: UI Light Mode Default - UI Light Mode Inverted & UI Dark Mode Default - UI Dark Mode Inverted https://www.figma.com/file/5K0FOHCrp4gYwAwFphEbRx/Test-(Variables)-Inverted?type=design&node-id=2302%3A3184&mode=design&t=rLEEtdlmqLQyrYH5-1

[coraliefeil]

Mhhhh .... wonder if we should move on with this or better not https://www.linkedin.com/posts/sil-borm%C3%BCller-%F0%9F%91%8B%F0%9F%8F%BB-316923bb_figma-tokensstudio-activity-7104748652824256512-0woE/?utm_source=share&utm_medium=member_ios @mariohamann

[karlbaumhauer]

@van-nguyen-ht has some first insights and will discuss with @mariohamann

[coraliefeil]

Figma Variables are still not 100% stable and we have quite some effort on our end ... we’ll remove this from 1st solid release and postpone it to a later point.

[van-nguyen-ht]

Figma variables could potentially used for inverted variants so consumers could layout faster on primary background. In the same vein, once dark mode is integrated, setting up variables instead of Figma native styles could help save time in layout.