Back to Plugins
Data Frame

Data Frame

Automate personalization by merging a design template with the .csv data source.

importmergemail mergeimport csvdata importdataproductivitytablecsvpopulateautomate

Plugin Preview

Data Frame preview

About this plugin

Data Frame automates mail merge in Figma by allowing you to import CSV data and automatically populate design templates with personalized content.


This plugin allows you to:

  1. Select multiple frames, groups, or component instances (as design template)
  2. Upload a CSV file containing your data
  3. Map CSV columns to text layers in your selected template
  4. Automatically generate multiple instances of your template, each populated from each row of data in the CSV file.


Example use:

  1. Business Cards: Create a sleek business card template and instantly generate cards for your entire team by importing employee details from a CSV file.
  2. Event Badges: Design a conference badge layout once, then use Data Frame to populate it with attendee information, creating unique badges for hundreds of participants in seconds.
  3. Order Packing Slips: Design a packing slip template and instantly generate customized slips for each order, complete with customer details, order numbers, and item lists from your e-commerce platform's CSV export.
  4. Personalized Email Designs: Design an email template in Figma and use Data Frame to visualize how it will look for different subscribers, importing names, account details, and custom offers from your CRM's CSV export.


Perfect for creating dynamic mockups, personalised designs, or at scale documents. Data Frame saves time and ensures accuracy when working with large datasets in your Figma projects.

Plugin Details

Version2
CreatedSeptember 18, 2024
Last UpdatedOctober 4, 2024
CategoryImport & export plugins
CreatorCristian C.
Stats33 installs, 3 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:index.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none