Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save R-ohit-B-isht/92bf887aec7c623e930f34cfb3307407 to your computer and use it in GitHub Desktop.
Save R-ohit-B-isht/92bf887aec7c623e930f34cfb3307407 to your computer and use it in GitHub Desktop.

Exporting Figma Files to specified Format Playbook

This playbook outlines the steps taken to export design assets from a Figma file to specified format using the Figma API.

Prerequisites

  • Personal access token from Figma with the necessary scopes.
  • The Figma file URL or key.
  • curl and jq installed on the local machine.
  • A bash shell environment.

Steps

1. Authenticate with the Figma API

Use the personal access token to authenticate API requests. The token is used in the header of the curl requests.

2. Retrieve the Figma File Structure

Make an API call to retrieve the JSON structure of the Figma file using the file key.

3. Parse the JSON Structure

Use jq to parse the JSON structure and extract the node IDs for the frames or layers to be exported.

4. Export the Selected Assets

Construct an API call to the Figma API's GET /v1/images/:file_key endpoint, passing the node IDs as parameters and specifying the format as specified.

5. Download the Images

Write a bash script to download all the specified format images from the provided URLs and save them in a directory with their node IDs as filenames.

6. Verify the Exported Files

Check the downloaded files for correct format and quality. Ensure they match the original design assets in the Figma file.

7. Report Completion

Report the completion of the task to the user with details of the exported files. Provide the files for user verification.

Notes

  • Do not overwrite files without permission.
  • Refer to the Figma API documentation for detailed information on API endpoints and export settings.
  • Adjust export settings via API as needed: file name, resolution, scaling.
  • Verify exported files for correct format and quality before final delivery.
  • Test exported files in intended environment (e.g., web, print).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment