Created
August 14, 2023 17:32
-
-
Save santaklouse/259e7b9a67ffd9019f4d846c75c1146b to your computer and use it in GitHub Desktop.
download json or image for selected Figma design
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // run this function in dev console | |
| function downloadBlob(blob, name = 'file.txt') { | |
| // Convert your blob into a Blob URL (a special url that points to an object in the browser's memory) | |
| const blobUrl = URL.createObjectURL(blob); | |
| // Create a link element | |
| const link = document.createElement("a"); | |
| // Set link's href to point to the Blob URL | |
| link.href = blobUrl; | |
| link.download = name; | |
| // Append link to the body | |
| document.body.appendChild(link); | |
| // Dispatch click event on the link | |
| // This is necessary as link.click() does not work on the latest firefox | |
| link.dispatchEvent( | |
| new MouseEvent('click', { | |
| bubbles: true, | |
| cancelable: true, | |
| view: window | |
| }) | |
| ); | |
| // Remove link from body | |
| document.body.removeChild(link); | |
| } | |
| //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | |
| // | |
| // select node in figma and run code below in dev console in order to: | |
| // | |
| // 1. download json for selected node with children | |
| (async () => { | |
| const selectedNode = figma.currentPage.selection[0] | |
| const json = await selectedNode.exportAsync({format: 'JSON_REST_V1'}) | |
| // Return a JSON object in the same format as the Figma REST API response | |
| console.log(json.document) | |
| bytes = new TextEncoder().encode(JSON.stringify(json.document)); | |
| blob = new Blob([bytes], { | |
| type: "application/json;charset=utf-8" | |
| }); | |
| setTimeout(() => downloadBlob(blob, `${selectedNode.id}-${selectedNode.name}.json`), 0) | |
| })(); | |
| //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | |
| // 2. download image of swelected design | |
| (async () => { | |
| const selectedNode = figma.currentPage.selection[0]; | |
| const image = await selectedNode.exportAsync({ | |
| format: 'JPG', | |
| constraint: { type: 'SCALE', value: 0.5 }, | |
| }); | |
| let imageBlob = new Blob([image.buffer], {type: "image/jpg"}) | |
| setTimeout(() => downloadBlob(imageBlob, `${selectedNode.id}-${selectedNode.name}.jpg`), 0) | |
| })() |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment