- Export JSON with Design Tokens Plugin:
- Plugin link: Design Tokens
- When exporting to file, exclude:
- Typography (as it is redundant in font styles)
- Grids (are used in Figma just as helper for icons etc)
- Navigate to the Project Folder
- Install Style Dictionary Locally:
- Run
npm install style-dictionary
- Run
- Launch Style Dictionary Locally:
- Run
npx style-dictionary build
- Run
- Export SVG with Frame Exporter Plugin:
- Plugin link: Frame Exporter
- Settings for export:
- File name format:
$F-$V
- Case: Kebab
- Join variants with:
-
- File type: SVG
- File name format: