Hey there 👋

Hope your journey with Figma Variables is going as planned — happy to help you!

If you’re looking for answers, you’re in the right place. As the Figma Variables is still in beta, things can change pretty quick, from limitations to API methods, causing potentially the plugin to not working as desired.

Please keep in mind that this is a one-person-plugin with no dedicated user support behind, as a result not every request can be taken into account immediately.

Not affiliated with Figma or an official Figma plugin.

Why this plugin? 😅

Support of design tokens has been heavily requested by the Figma community and Variables are a great approach to becoming more compatible with the Design Tokens Format Module (DTFM).

This plugin intends to help people leveraging the power of Variables, as they allow them to go crazy and be way more precise with Aliases and Modes, being way more closer to the reality of multi-platform/products/brands/language/whatever world and their engineer friends.

I also know the huge amount of time that can represent a transition from Styles to Variables, so here you go design friends, have fun:

Styles to Variables

Features 🔥

Color styles detection

• As color styles can only one value per mode, the plugin only detects color styles with one property (as you can stack multiple properties, the same way as effect styles for borders).
• If your style name contains a dot, it will be replaced by a dash.
• The plugin only detects color styles with Normal as blend mode option, this means it will not detect Multiply, Lighten, Darken, etc blend modes availables with color styles.