Moving or copying variables

Has anyone found a way to copy, transfer or move the new local variables to another file or collection?

Just created around 400 color variables manually in the wrong file and would hate having to re-create them in the correct one :sweat_smile:

17 Likes

It seems SHIFT + Enter does the trick after selecting a variable.

6 Likes

Awesome shortcut for duplication, will save some time for sure! :smiley:

You haven’t found a way to transfer the variables to another file though right?

1 Like

I had the same question and found this:

Copy pasting variables across files

Variables can be used in prototypes.

Currently, if you copy and paste objects to different file, the prototype will continue to work as the variables transfer over. However, any unpublishedvariables applied to prototypes won’t be available for further use, like when creating Set variable actions, or switching an object’s number variable.

We are working on improving transferring variables across files. As a workaround, either recreate the variables in the destination file, or duplicate the original file.

If the original file is published to team libraries, copied and pasted variables will work as expected.

If you receive a notification that pasting unpublished variables across files won’t create new local variables yet, try publishing the source library and and enabling it in the destination file.

7 Likes

Ahh bummer, will have to go manual again then, thanks for finding this! :slight_smile: Hope they add the feature soon :crossed_fingers:

4 Likes

Has this feature been added yet? I’ve also made a mistake of generating 100+ variables in a file that I originally intended to delete :frowning:
I was able to publish this file to use the variables in the correct design system file, but I’d hate to leave the wrong file in my pj folder just because I need to use it as a variables library. Is there really no other way to move these variables to the file I want…?

3 Likes

In addition to moving variables from one file to another, I’d also like to have a way to copy aliases and variables within a file. For example, I have 10 variables across 2 modes which all need to have the same alias applied to them. The current workflow requires that I manually assign an alias every time, instead of copying an alias from an existing variable.

5 Likes

I managed to find a workaround by exporting them as json and importing them back via the same JSON

For export I use this plugin: https://www.figma.com/community/plugin/1254848311152928301

For import I use this one:

As a caveat for the second plugin, be aware you’ll need to perform some cleanup work post-export. Not a huge deal, but a bit annoying.

If you are going to use the import from the first plugin, it will give you a range exception and you’ll have to reload the file. Just be aware of that !

6 Likes

thanks dude.

I can’t make it work with Variables Export/import, even though I copy the code into a JSON-file. I get error messages when trying to import the file with Vaiables import and also when pasting the code in the window in the Variables Imoprt/Export plugin.

1 Like

Doesn’t work for me either. When I click try to Export the Variable Collection, nothing happens. I can see them as codes and I can see the blue Export Variable CTA but nothing happens when I click on it :frowning:

Hey there! I used this for my colour variable collection and it worked. My project was a website with dark and light mode and I had created the colour variable collection on the Design System file (let’s call it file A). In order to use it on my prototype file (file B), I tried to look for a way to transfer the variables so that I could see what colour in the light mode is equivalent to the one on the dark mode.

Since the variables are not sharable like libraries, I looked into different solutions and here’s what I found:

When you create a set of colour variables, it’s usually saved as local library. (you can see them in Libraries under Local colours). So I published my local library of file A, and used it on as a library on file B. Although it didn’t show me the colour equivalencies as a table, I still could find the equivalent colours by switching between light and dark mode on my file B.

Hope it helps :slight_smile:

This plugin did it for me for 5 seconds:

6 Likes

@Richard_Simms I built a plugin to restore variables used in a prototype and relink them on your new file

here is the tutorial post about:

The export/import function of this plugin is amazing!

Found another free plugin:

I just updated my plugin to move your variables and you can now select the variables you want to move and it will take all the depending variables and copy them to your new file.

I created a small tutorial video for it (4mins), I hope it will help you

In case of any additional questions or desired improvements, don’t hesitate to let me know on the plugin page or here
If you like the plugin and find it useful please feel free to give it a like and share it :hugs: !

2 Likes

Did try a different approach and faced a weird break in detaching patterns within Figma.

–– When I wanted to get rid of color styles, I had to …

  1. Reference the color variable as value of the style
  2. Publish changes and pull into all files
  3. Delete the styles → they automatically detach and the value (color variable) is set instead.
  4. So the mechanic of detaching to me seems to follow the rule:
    the element I detach is maintaining all the information that sits inside of it and gets only diconnected from it’s selected level.

–– When detaching a component

  1. All items used inside the component itself will remain same
  2. To me again it seems like the same rule applies:
    the element I detach is maintaining all the information that sits inside of it and gets only diconnected from it’s selected level.

–– However, when I try to move a variable between files using this detaching logic, the pattern breaks, and I am wondering why? …

  1. Link the color variable (e.g. of a different library Foundation/Primitives) as value of the previous variable (because it sits in the wrong file, but is connected to lots of different files)
  2. Publish changes and pull into all files
  3. Delete the variable (from the file I initially want to move it from)
    → assumption based on patternit will automatically detach and the value (color variable of the foundations file) is set instead, but…
    → it detaches also the referenced color variable and only the hex value is shown, …
    WHY??
1 Like

@Elham_Mahootchi Copy the Export code you see to the clipboard, then go to the Figma where you need to import the variables and paste the code into the Import code textarea and click Import. Magic done. Hope it helps :slightly_smiling_face:

I just created a plugin that allows you to copy and paste variables between different collections or files. You can also export variables as JSON and import it as another collection. All properties like scoping and code syntax will be remained.