Documentation Index

For the complete documentation index, see llms.txt. Markdown versions of docs pages are available through the page's alternate Markdown link.

Current page: Import/export Figma text layers with JSON files - This tutorial shows how to use the CopyDoc Figma plugin to export Figma text layers to a JSON file, edit the text in a code editor, and import the updated JSON back into Figma. It also demonstrates reviewing changes before applying them, including checking layer diffs and using design reference PNGs from the export.. Machine-readable page: /copydoc/tutorials/import-export-figma-text-layers-with-json-files.md.

Import/export Figma text layers with JSON files

This tutorial shows how to use the CopyDoc Figma plugin to export Figma text layers to a JSON file, edit the text in a code editor, and import the updated JSON back into Figma. It also demonstrates reviewing changes before applying them, including checking layer diffs and using design reference PNGs from the export.

← Back to CopyDoc Video Tutorials

What this video covers

This tutorial shows how to use the CopyDoc Figma plugin to export Figma text layers to a JSON file, edit the text in a code editor, and import the updated JSON back into Figma. It also demonstrates reviewing changes before applying them, including checking layer diffs and using design reference PNGs from the export.

Things you'll need

  • Figma
  • CopyDoc

Steps

  1. Install the CopyDoc plugin from the Figma Community and open it from Figma's Plugins menu.
  2. Choose the export option and click Export JSON to load the top-level frames you want to include.
  3. Click Download Text to save the exported ZIP, which contains the JSON file and, if selected, a frames folder with PNG design references.
  4. Open the JSON file in a code editor, update the text values, and save the file.
  5. In CopyDoc, switch to Import text updates to Figma from JSON and drag the edited JSON file into the import box.
  6. Review the detected text changes, optionally deselect any layers, and use the magnifying glass icon to jump to the affected text on the canvas.
  7. Click Update Figma Text Layers to apply the approved changes, or undo with CMD + Z on Mac or CTRL + Z on Windows if needed.

Useful links