Back to Plugins

Figma Token Exporter
Token export made a breeze - Load your variables and export them in various formats for handover
csstokenstailwindlessvariableshandoffstylingstylusdesign systemdevelopmentconsistencysass
Plugin Preview
About this plugin
This tool is designed to extract Figma variables/tokens and export them in CSS, SASS and other formats for handover to development.
Features
- Load tokens from your Figma file
- Select collection
- Select modes/themes
- Select syntax: CSS, SASS, Less, Stylus, Tailwind
- Select naming convention if using "Code Syntax"
- Export all variables in table
- Export individual variables by row
- Search variables table
- Sort variables table
- Show custom variable name if using "Code Syntax" (variable name highlighted in bold)
- Download all variables in selected syntax
- Download individual variables in selected syntax
- Plugin support for dev mode
Plugin Details
Version | 6 |
---|---|
Created | February 29, 2024 |
Last Updated | June 11, 2024 |
Category | Software development |
Creator | Figma-tokens |
Stats | 739 installs, 83 likes |
Pricing | Free |
Technical Details
- API:1.0.0
- UI:ui.html
- main:code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- https://cdn.figma-tokens.com
- https://fonts.googleapis.com
- https://fonts.gstatic.com
More Like This
Discover other plugins in the Software development category.
Figma to Code (HTML, Tailwind, Flutter, SwiftUI)
Code Conversion Made Easy: Figma to Web & Apps
Anima - Figma to Code React, HTML, CSS, Tailwind, MUI (DevMode Inspect React / HTML / Vue / CSS)
Anima - AI Powered Design to code
Builder.io - AI-Powered Figma to Code (React, Vue, Tailwind, & more)
Export designs to responsive code (React, HTML, Vue, Tailwind, etc) with AI