Variables and Styles Extractor

About this plugin

☕️ The easiest way to migrate your design system between Figma files.

🔓 OPEN SOURCE

View the full source code: https://github.com/tknatwork/side-kicks/tree/main/variables-styles-extractor

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

🎯 FEATURES

✓ Export variable collections (COLOR, FLOAT, STRING, BOOLEAN)

✓ All Variable Modes (multi-mode support)

✓ Export all style types (Color, Text, Effect, Grid)

✓ Preserves variable aliases and mode values

✓ Multi-mode import with mode selection

✓ Maintains style-to-variable bindings

✓ Smart plan validation (Starter/Pro/Org/Enterprise)

Perfect for:

→ Migrating design systems between files

→ Backing up your variables & styles

→ Sharing design tokens across projects

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

🔒 PRIVACY

• No network access - fully local

• No data collection

• Open source: github.com/tknatwork/side-kicks

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

📖 HOW TO USE

1. Open a Figma file with variables/styles

2. Run the plugin (Plugins → Variables & Styles Extractor)

3. Go to Export tab, select collections

4. Click "Export Selected" to download JSON

5. Open target file, go to Import tab

6. Drop JSON file or paste contents

7. Click "Import" to apply

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

💬 SUPPORT

Report issues: github.com/tknatwork/side-kicks/issues

Free & open source under MIT license.

Made with ☕️ by Tushar Kant Naik

https://tusharkantnaik.com