The FISYCO plugin sends the local variables of a Figma file to a tokens library in FISYCO, which delivers them to your repository as pull requests. The Figma REST API returns variables on Enterprise plans only, so on other plans the plugin is how variables reach FISYCO. Styles don't need it: FISYCO reads them over the API itself.
Before you start
- Figma and a repository are connected to the project. See Connect Figma and Connect a repository.
- To create a library, you are a project maintainer or a workspace owner or admin.
- You have a FISYCO account. The plugin works on its behalf.
Install the plugin
Install the plugin from Figma Community. It is then listed under Plugins in your Figma design files.
Sign in with a code
- In Figma, run Plugins → FISYCO and click Connect. The plugin shows a code and opens the FISYCO sign-in page.
- Sign in to FISYCO if the page asks you to.
- Type the code from the plugin into User code and click Continue.
- Check the app name and the account, then click Approve. The plugin continues on its own.
The code is valid for 10 minutes. The page never fills it in from the link, so nobody can get access approved by sending you a link.
Create a tokens library and send variables
- In FISYCO, add a Tokens library to the project. On General, enter a name and paste the link to the Figma file.
- On Sync method, pick Styles automatically, variables via the plugin. On Styles, keep the style groups you need and click Set up Local variables.
- The Variables step now waits for the plugin. In Figma, open the same file and run the plugin. It shows FISYCO is waiting for variables. Click Send variables.
- Back in the browser, the step lists the collections and groups from the file. Pick the groups to sync.
- On Generation, set formats and structure, then click Create library. The variables you sent go into its first run.
The wait belongs to your FISYCO account, not to the file, so sign in to the plugin with the same account. It lasts 30 minutes. After that the plugin says FISYCO is no longer waiting: open the Variables step again and resend.
How to pick groups
A tokens library syncs groups, not whole files. A group is the first part of a variable name inside its collection: color/brand/primary belongs to the color group.
- Nothing is ticked on the Variables step at first. Tick the groups you want; ticking a collection ticks all its groups.
- An empty selection syncs nothing. An unticked group never reaches the code, and a group added in Figma later stays out until you tick it.
- The plugin always sends every local variable. FISYCO keeps only the groups you picked.
- To change the selection later, open the library's Browse tab, click Edit composition, then Save composition. It applies on the next sync.
Unticking a group whose tokens are already in the code removes them in the next pull request. Edit composition shows how many before you save.
Send changes
- Open the plugin in the file. The first time, it asks Which library does this file feed? Pick one and click Continue. The choice is saved in the file, so collaborators get it too.
- Click Send to followed by the library name. Change library switches to another of your tokens libraries.
- The plugin shows what is new, changed and unchanged, with a link to Open the run.
The pull request opens on its own if Automatically create a PR after each sync is on in the library's settings. Otherwise, click Create PR on the library page. Output formats are covered in Tokens in CSS, SCSS and TypeScript.
FISYCO can't fetch variables without the plugin. When Figma reports a variables publish after your last send, the library shows Variables changed in Figma. Open the plugin and send again.
The Refresh tokens button
After your first Send to, a Refresh tokens button appears in the file's properties panel. It sends the variables without opening the plugin window, as does Plugins → FISYCO → Quick Sync. It only acts when the file is linked to a library and no library setup is waiting. Otherwise it tells you what to do first.
What the plugin sends
- The local variables of the open file: names, types, values for each mode, modes, collections and scopes.
- The file name, so FISYCO can show where the variables came from.
Nothing else leaves Figma: no layers, images, comments or styles. The sign-in is kept in Figma's plugin storage on your device. The library you pick is saved in the file.
Disconnect or switch accounts
Click Disconnect at the bottom of the plugin window. The plugin forgets the sign-in, so you can connect with another account. The file stays linked to its library.
Help and support
Write to support@fisyco.com with the file name and what you did. How we handle data is described in the Privacy Policy.