Auto repeat and sync Figma layers from a spreadsheet

This video tutorial is a complete step-by-step guide showing you how to automatically repeat and sync Figma layers from a spreadsheet using the CopyDoc plugin.

This can be really helpful for designs that contain repeating grids or lists where you need to populate it with real content automatically.

You can also use this feature to rename layers or apply CSS styles from your spreadsheet, too.

Example spreadsheet structure for content sync with Figma layers

Regardless of if you're using an XLSX, CSV or Google Sheet for your spreadsheet, the structure is always the same; the very first row (or the "header") of your spreadsheet has to contain the names of the Figma layers that you would like to sync the rest of the rows underneath it with.

You can name these whatever you like, but it's easiest to use a short yet descriptive hashtag format like: #Title or #Description. In Figma, you would then name your text layers #Title or #Description as well; this will ensure that they are mapped together when the spreadsheet is synced up in the plugin later.

#Title	#Genre	#Age Rating	#Total Reviews
No Time To Die	Action	13	123 Reviews
Dune	Sci-Fi Action	14	124 Reviews
Black Widow	Action	18	125 Reviews
Suicide Squad	Action	18	125 Reviews

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.

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

If you'd like to dynamically name the new auto-repeating Figma layer from your spreadsheet data, too, you can do this by ensuring the Figma layer name that you're repeating (eg. #Title) matches a column in the spreadsheet that you're syncing; this will automatically use the value from each row under the #Title column in your spreadsheet as the layer name for each duplicated Figma layer.

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 (eg. My Frame Layer (Row 3)) instead.

Supported Markdown formatting for text content

You can optionally add some basic markdown formatting (bold, italics) and links to your spreadsheet content, which will automatically be applied when the snippet is synced to your Figma text layer.

• You can specify Bold text by using double asterisks **Snipet text to bold** or double underscores eg.__Snipet text to bold__
• You can specify Italic text by using single asterisks *Italic Snippet Text* or single underscores eg._Italic Snippet Text_
• You can specify Bold Italic text by using triple asterisks ***Bold Italic Snippet Text*** or triple underscores eg.___Bold Italic Snippet Text___
• You can specify hyperlinks by using the markdown syntax of This is [my link here](https://example.com) in a text snippet (you can also format the link text by adding the bold/italic syntax inside of the link's [] text area).