Syncing content to Figma from a CSV/XLSX file

If you've created your spreadsheet as either a .csv or .xlsx file, you can sync it with your Figma design by clicking the Sync Content button in the main CopyDoc plugin screen, which will open up the settings panel for this feature.

Video Tutorial: Sync XLSX Excel spreadsheet content to Figma

This video walks through how to sync content from an Excel spreadsheet to your Figma designs using the CopyDoc plugin.

Video Tutorial: Sync CSV spreadsheet content to Figma

This video walks through how to sync content from a CSV spreadsheet to your Figma designs using the CopyDoc plugin.

Video Tutorial: Auto repeat and sync Figma layers from a spreadsheet

This video walks through how to automatically repeat and sync Figma layers from a spreadsheet using the CopyDoc plugin.

Video Tutorial: Sync a folder of images to Figma layers via a spreadsheet

This video walks through how to sync an images folder with Figma layers using a spreadsheet with the CopyDoc plugin.

Video Tutorial: Sync SVG icons from a spreadsheet to your Figma layers

This video walks through how to sync SVG icons from a spreadsheet to your Figma layers with the CopyDoc plugin.

Syncing your CSV or XLSX file content to Figma layers ​

You can preview your spreadsheet contents by either dragging and dropping your correctly structured .csv or .xlsx file into the Sync XLSX/CSV File dropzone area, or by clicking it and selecting the file manually by browsing for it on your computer.

Ensure that you select at least one layer in Figma that contains renamed layers to match your spreadsheet headers, and then click on the Sync Rows with Layers button (Sync & Repeat Selected Layer when Auto Repeat is on). This will sync the content from your spreadsheet with your selected renamed Figma layers.

Figma text layers with missing fonts can't be updated. If your Figma text layer contains a missing font, the plugin won't be able to update it. Please ensure any text layers you would like to update in any way using the CopyDoc plugin have their missing fonts resolved.

Auto repeat a single Figma layer with your spreadsheet rows ​

When using the Content or Styles sync tab options, you can automatically repeat a single Figma layer by enabling the Auto Repeat toggle, which will automatically copy the original selected Figma layer and duplicate it as many times as the number of rows that your spreadsheet data contains.

Use this to turn one card, catalog item, or campaign layout into a populated design for each spreadsheet row. Text and image layers inside the design use the matching spreadsheet columns.

If you select a main component, CopyDoc creates an instance for each row. Selecting an existing instance duplicates that instance; selecting a frame duplicates the frame.

If your selected Figma layer is already directly inside of another Figma layer with Auto Layout enabled, the selected layer will automatically be duplicated inside of that parent layer, otherwise, CopyDoc will create a brand new Auto Layout frame and duplicate your new Figma layers there instead.

Dynamic auto-repeating parent layer names ​

To name each duplicated Figma layer from your spreadsheet, match the selected template layer's name to a column header. CopyDoc uses that column's value from each row as the new layer name.

A single leading # is optional: a layer named #Title can match a Title column, and a layer named Title can match a #Title column. If both headers exist, the exact match takes priority, including when its value is blank. Capitalization and spaces must still match.

If there's no matching layer name in your spreadsheet, the CopyDoc plugin will take the original Figma layer name and append a row number to it (for example, My Frame Layer (Row 3)) instead.