Juxync - Figma to Jux
Building a solid color token system can be challenging. If you’ve already set up Figma variables, you can use Juxync to seamlessly import them into Jux as design tokens.
Juxync converts your Figma token collections, groups, and modes into organized token sets, preserving all their relationships.
How does Juxync work?
- Scan Figma Variables: Juxync scans the color variables in your selected Figma file.
- Auto-Mapping of Tokens: The plugin automatically maps tokens into core and other semantic sets. (See the tutorial below for more details.)
- Sync Tokens into Jux: Sync your tokens into Jux’s token management system, allowing developers to access them via our CLI.
Tutorial
-
Log in to Jux: Open your Jux account and copy the Secret Key from the Jux editor. You’ll find it in the top-right context menu in the navigation bar.
-
Open the Figma file with your color variables, run the plugin, and paste your Secret Key into the plugin screen.
-
Automatic Mapping: The plugin will automatically map your collections to token sets. In Jux, token management is organized into sets:
- Core: A mandatory set.
- Semantic Sets: Reference the core tokens (e.g., light/dark themes or specific tokens).
- Collections with one mode are recognized as part of the Core set, while those with multiple modes are mapped to semantic sets, keeping their reference to the core. Groups will be exported to Jux exactly as they are organized in Figma.
Make sure each collection / group / mode of variables are mapped correctly to the target sets in Jux.
-
Review and Confirm: Ensure that each collection, group, and mode of variables is correctly mapped to the target sets in Jux.
Planned Features
- Sync assets (SVGs, images, etc.)
- Dimension tokens
- Typography styles
- Looking for more? Let us know!