I built a Figma plugin to sync design tokens between Figma and code
If you’ve worked with design systems, you probably know this workflow:
Design tokens live in Figma.
Code lives in GitHub.
And every time something changes… someone manually syncs them.
I’ve been that someone.
So I built Tokvista — a Figma plugin to make the design token workflow smoother between design and development.
What Tokvista does
• Sync Figma Variables
• Generate token systems with AI
• View tokens in visual, table, or JSON formats
• See a full token diff before publishing
• Export to CSS Variables, SCSS, Tailwind config, or tokens.json
• Publish directly to GitHub with versioned snapshots
• Share a live preview link so developers can explore tokens
One feature that people seem to like is the AI token generator.
You can type something like:
“dark fintech app, neutral grays, tight spacing”
Tokvista generates a full foundation + semantic token system that can be imported into Figma instantly.
The goal is simple: make design tokens actually work as the bridge between design and engineering, instead of becoming another manual step in the workflow.
Still improving the plugin and would love feedback from people working with design systems or design tokens.
You can check it out here:
https://www.figma.com/community/plugin/1609493358238428587/tokvista
Top comments (0)