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: Sync chart data to Figma from a spreadsheet - This tutorial shows how to use the CopyDoc Figma plugin’s sync content feature to import charts into Figma from spreadsheet data. It demonstrates loading CSV files or a Google Sheets URL, previewing the chart, and inserting an editable chart into a Figma file.. Machine-readable page: /copydoc/tutorials/sync-chart-data-to-figma-from-a-spreadsheet.md.

Sync chart data to Figma from a spreadsheet

This tutorial shows how to use the CopyDoc Figma plugin’s sync content feature to import charts into Figma from spreadsheet data. It demonstrates loading CSV files or a Google Sheets URL, previewing the chart, and inserting an editable chart into a Figma file.

← Back to CopyDoc Video Tutorials

What this video covers

This tutorial shows how to use the CopyDoc Figma plugin’s sync content feature to import charts into Figma from spreadsheet data. It demonstrates loading CSV files or a Google Sheets URL, previewing the chart, and inserting an editable chart into a Figma file.

Things you'll need

  • A Figma file with the CopyDoc plugin available
  • A CSV file or a Google Sheets URL with chart data

Steps

  1. Open the CopyDoc plugin in Figma from Resources or from Plugins > Saved plugins.
  2. Click sync content, switch from the Content tab to the Chart tab, and choose a chart type such as bar chart or column chart.
  3. Download the sample CSV for that chart, edit it with your own data in a spreadsheet app, and save it.
  4. Drag and drop the updated CSV into the plugin Drop Zone to preview the chart.
  5. Click insert chart to Figma to place the chart on the canvas as editable layers.
  6. To use Google Sheets instead, switch the data source to Google Sheets, paste the sheet URL, select the tab, load the chart preview, and insert the chart to Figma.
  7. Edit the inserted chart in Figma by changing layer properties such as colors, fonts, size, and other selection colors.

Useful links