npmpackage.info

Gathering detailed insights and metrics for figma-assets-generator

figma-assets-generator - 1.2.0 | npmpackage.info

figma-assets-generator

Creates assets (SVG, JPG, PNG) from a figma document (e.g. a "Icons" page in one of your files) and places them locally in a folder.

1.2.0

JavaScript

22.33 kB

1.3

Installations

npm install figma-assets-generator

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

12.14.0

NPM Version

6.13.7 Pull Requests

Open

9

Total

18

Closed

3

Merged

6

Issues

Open

1

Total

4

Closed

3

Releases

Unable to fetch releases

Languages

JavaScript

JavaScript (100%)

Developer

six7

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

94 Stars

33 Commits

9 Forks

2 Watchers

9 Branches

1 Contributors

Updated on May 24, 2025

Maintainers

View All 1 Contributors

Package Meta Information

Latest Version

1.2.0

Package Id

figma-assets-generator@1.2.0

Unpacked Size

22.33 kB

Size

6.26 kB

File Count

NPM Version

6.13.7

Node Version

12.14.0

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

@babel/polyfill dotenv figma-js fs listr node-fetch

Dev Dependencies

@babel/cli @babel/core @babel/preset-env babel-eslint eslint eslint-config-airbnb eslint-config-prettier eslint-plugin-prettier np watch

Figma Assets Generator

Creates assets (SVG, JPG, PNG) from a figma document (e.g. a "Icons" page in one of your files) and places them locally in a folder.

Usage

Ideal use: create a script in your package.json and run the script whenever you need, however you could also run this programmatically.

Installation

npm install --save-dev figma-assets-generator

yarn add -D figma-assets-generator

Use as npm script

Provide a figma-assets-generator.json file with the following configuration:

{
  "personalAccessToken": "YOUR_ACCESS_TOKEN",  // required: your figma access token (you can provide this as FIGMA_TOKEN in a .env file)
  "fileId": "YOUR_FILE_IDE", // required: file id where your icons document is stored
  "documentId": "123:456", // required: node of your icons document, e.g. "453:8089"
  "fileExtension": "svg", // optional: ["svg", "jpg", "png", "pdf"], default: svg
  "output": "assets/icons/svg" // optional: folder (relative path from working directory) where icons will be saved to, defaults to "assets",
  "scale": "1" // optional, values between 0.05 and 4 are possible, default: 1
}

Run

npx figma-assets-generator

on the command line, or via node_modules/.bin/figma_assets_generator

or create a new entry in package.json under scripts:

"figma-generate": "figma-assets-generator"

// Todo: If no figma-assets-generator.json file was provided a wild wizard appears!

Use within your *.js files

Include figma-assets-generator in your project, provide required options and call getFigmaAssets(options) whenever you want to pull and create icons.

const { getFigmaAssets } = require("figma-assets-generator")

const options = {
  personalAccessToken: "5316-049f89713-0134-46b5-b426-22d1251cbc6",  // required: your figma access token (you can provide this as FIGMA_TOKEN in a .env file)
  fileId: "gAMN5xYfhC2BTVKnht3PAk43", // required: file id where your icons document is stored
  documentId: "453:8089", // required: node of your icons document, e.g. "453:8089"
  fileExtension: "svg", // optional: ["svg", "jpg", "png"], default: svg
  output: "assets" // optional: folder where icons will be saved to, defaults to "icons" (cannot have subdirectories, see #17)
}

getFigmaAssets(options)

How do I get fileId and documentId ?

To get the fileId you need to open the document in your browser, the fileId is indicated in the address bar:

https://www.figma.com/file/KiFw6W2QjnKqhA4hoWsrhQ/Untitled?node-id=0%3A123

The part after /file/ would be the fileId (in this example KiFw6W2QjnKqhA4hoWsrhQ) and the documentId would be the part after node-id= (in this example 0%3A123 - however %3A is just HTML Encoding for : so the document id would be 0:123

Caveats

Replaces / and . in component names with _.

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

License

Determines if the project has defined a license.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Reason

46 existing vulnerabilities detected

Details

Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8
Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
Warn: Project is vulnerable to: GHSA-6chw-6frg-f759
Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
Warn: Project is vulnerable to: GHSA-4w2v-q235-vp99
Warn: Project is vulnerable to: GHSA-cph5-m8f7-6c5x
Warn: Project is vulnerable to: GHSA-wf5p-g6vw-rhxx
Warn: Project is vulnerable to: GHSA-jr5f-v2jv-69x6
Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm
Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q
Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c
Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc
Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp
Warn: Project is vulnerable to: GHSA-8r6j-v8pm-fqw3
Warn: Project is vulnerable to: MAL-2023-462
Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97
Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37
Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp
Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
Warn: Project is vulnerable to: GHSA-7wpw-2hjm-89gp
Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g
Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
Warn: Project is vulnerable to: GHSA-4g88-fppr-53pp
Warn: Project is vulnerable to: GHSA-4jqc-8m5r-9rpr
Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9
Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw
Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc
Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh
Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p
Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp

Score

1.3

/10

Last Scanned on 2025-07-07

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More