Download and process SVG Icons from a Figma page into a spritesheet and JSON list

• Overview
• Features
• Getting Started
  • Installation
  • Running figma2svg
• Project Roadmap
• Contributing
• License

The figma2svg script automates the extraction of SVG icons from a Figma project, converting them into a spritesheet and JSON list.

The project's primary goal is to streamline the process of integrating custom icons from Figma designs into web development projects.

• Fetch SVG icons from a Figma document.
• Process icons to ensure "currentColor" on both fill and stroke.
• Generate a single SVG spritesheet for all icons.
• Produce a JSON list of icons for easy reference and integration.

Requirements

Ensure you have the following dependencies installed on your system:

• Python: version 3.6+

You will also need a Figma access token to use the API (file key and personal access token). You can obtain these by following the instructions here.

1. Clone the figma2svg repository:

git clone https://github.com/cstrlcs/figma2svg

2. Change to the project directory:

cd figma2svg

3. Install the dependencies:

pip install -r requirements.txt

Use the following command to run figma2svg:

python main.py

This will fetch the icons from your Figma file, process them into SVG format, compile them into a spritesheet, and generate a JSON list of the icons for integration into your web projects.

It may take a while, since we don't want to overload Figma's servers with too many requests.

• ► Add more CLI options to customize the output.
• ► Option to recovery from failed downloads.
• ► Option to update missing icons.

Contributions are welcome! Please feel free to submit a Pull Request or open an Issue if you have any suggestions or ideas.

This project is licensed under the MIT License - see the LICENSE file for details.