Insert randomized data from Google Sheets into tagged layers in your designs. Supports text, images, and colors.
How to use:
1. Create a public Google Sheet. The headings for each column in your sheet is then used to tag layers in Figma.
2. Run the Data Roulette plugin. Create a new data set and paste yuor public sheet url in
3. Tag layers in Figma with column titles prefixed with ‘#’
4. Select layers and click “Insert Data” to get random data inserted based on the tags in your selection
Tags
– Tag layers with using ‘#’ followed by the column title. Example: #Description for a column titled ‘Description’ in Google Sheets
– Tags can contain spaces. Example: #User Name
Data Sets
– Create multiple Data Sets to separate and organize data from multiple spreadsheets
Combine Tags
– Combine tags using ‘+’. Example: #First Name + #Last Name
– You can insert a text value and color the text using this method. Example: #Comment + #Comment Color
Images
– Add urls to images (must be https) in your sheet. Tagging shape layers with image url data will apply the linked images as fills.
– Supports base64 data urls (e.g. data:image/png;base64…)
Colors
– Add colors as Hex, RGB, or RGBA values in your sheet. Tagging a shape or text layer will apply colors as a fills.
Grouping
Data is grouped by row, so for instance if you have ‘Firstname’ and ‘Lastname’ columns, filling data into tagged layers will pair the appropriate values for that user entry. If you want to separate data use another data set, or create multiple sheets within a single Google Sheet for each tyoe of related data.