Fetch n Set 🐶 🦴

About this plugin

Fetch N Set is a powerful Figma plugin that allows you to populate your designs with real data from JSON files or APIs. It handles text, images, and nested data structures with ease, making it the perfect tool for designing with data.

Features

1. 🐶 Fetch Data: Load data from a local JSON file or fetch it directly from a REST API.
2. batch Population: Select multiple layers (frames, groups) and populate them all at once.
3. 🖼️ Smart Image Handling: Supports standard image formats (JPG, PNG). WebP Support: Automatically converts WebP images (which Figma doesn't natively support) using a built-in browser fallback. Robust Loading: Handles redirects and complex image headers gracefully.

1. 📂 Nested Data Support: Automatically flattens nested JSON objects (e.g., files: [{ url: "..." }] becomes files.0.url), allowing you to bind data to deep properties without manual reformatting.
2. 🎨 Intelligent Binding: Bind layer names to data keys (e.g., rename a text layer to #name to populate it with the name field).

How to use:

1. Load Data:Drag and drop a JSON file. Or click "Fetch from API" to make a GET request.
2. Explore Data:View your data in the interactive table. Click a row to inspect details.
3. Bind Layers: Select a layer in Figma. In the plugin Inspector, click a data key to bind it (renames layer to #key).
4. Populate:Select one or more parent frames in Figma. Click Populate Selected Layers.

Watch your design fill with real data!

This plugin is entirely open source

https://github.com/BrianAA/fetch-n-set

Buy me a coffee ☕️