Skip to content

Latest commit

 

History

History
30 lines (22 loc) · 973 Bytes

Readme.md

File metadata and controls

30 lines (22 loc) · 973 Bytes
Raw

Design Tokens and SVG Export Instructions

Figma: Export Design Tokens

  1. 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)

Project Setup: Install Style Dictionary

  1. Navigate to the Project Folder
  2. Install Style Dictionary Locally:
    • Run npm install style-dictionary

Build with Style Dictionary

  1. Launch Style Dictionary Locally:
    • Run npx style-dictionary build

Figma: Export SVGs

  1. 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