Populate

Design with read data

Plugin Preview

Dynamic content for real designs. Build simple tables, match group and layer names, click Populate. Designers get real data in seconds, not hours.

Key features

Multiple tables and rows: Organize content like Users, Products, Companies with flexible text, image, and reference fields.
Smart matching: Name the parent group as the table (e.g., Users) and the child layers as columns (e.g., Name, Email, Avatar) for automatic mapping.
One‑click populate: Select a frame or group and fill matching text and image layers instantly.
References and fallbacks: Link tables (e.g., Product → Category) and set defaults for missing values.
Save and reuse: Export/import JSON or JS and keep data in client storage for future projects.

How it works

Create tables: Add a table (e.g., Users), define columns like Name, Email, Role, Avatar, and add rows of data.
Match names: In Figma, set the parent group name to the table (Users) and child layer names to column names (Name, Email, Avatar) for perfect matches.
Populate: Select the target group or frame and click Populate to fill text and images from your table rows.
Reuse data: Your tables can be saved locally and exported; import later to continue work.

Tips for best results

Exact names: Group name must match the table; layer names must match column names exactly (case-sensitive).

About

Made by Filipe Almeida

For support send me a DM on X