Generator

GeneratorGenerator is a Figma plugin that helps you quickly generate multiple designs with changing data, such as certificates with different names or business cards with different contact information.

DefinitionsCSV headers: The top row of a CSV file, which contains the names of the data fields.

Variables: Text layers or certain text within a text layer that are linked to CSV headers.

ConventionsGlobal variables: Use the '#' symbol to indicate a global variable. For example, to use the 'Email' header as a global variable, name a layer '#Email' (Syntax: #VariableName)Inline variables: Use curly braces ('{}') to indicate an inline variable. For example, to use the 'Email' header as an inline variable, include '#{Email}' within the text of a text layer. (Syntax: #{VariableName})How to UseSelect a design frame and a text layer containing the CSV data you want to use. You can also use the file upload option to upload a local CSV file. Click next once you’re doneSelect the variables you want to include in your design from the available selection chips.(Optional) Enable inline variables to replace specific parts of a text layer rather than the whole. Avoid enabling it when unnecessary as it is a time-heavy operation.

Click 'Generate' to create the new frames with the specified text.

TipsMake sure to rename your layers or layer content according to the conventions mentioned above to use variables from the CSV data.

Feel free to check out our regularly-updated docs: https://rebrand.ly/generatordocsIf you have any further questions or need assistance, join our discord server or our telegram community.

Got more ideas?

Got any features you'd like to have us implement? Send them our way here