CSS variables import/export

Copy, export, or import your local Figma variables into CSS variables format.

Each collection is split up into modes and these are printed as "root:" groups in the CSS output.

This allows you to restructure the output into your preferred code format.

There are 3 tabs in the Export tab:

All variables – Print all of your local variables in CSS variables formatCherry pick – Pick two collections to print. For example, a primitive and semantic collectionAll local variables – Each collection is shown as a scrollable tableAnd 2 tabs in the Import tab:

Paste CSS – copy from your file and paste CSS variables, then import them as Figma variablesUpload File – Drag and drop a CSS file into the plugin to generate your variables, including aliases