Figma Make 整合 Payload，讓團隊建立及管理網站內容與數據

Payload joined Figma last year. In the past 12 months, Payload downloads have grown 6x. It’s now the fastest growing open source CMS on NPM. Learn more, including how to self-host or extend it, at Payload.org.

Websites and apps need to store and manage data, from published cont ent to information visitors submit. With Payload

Welcoming Payload to the Figma team

We're thrilled to announce that the team behind Payload, a leading open-source headless content management system (CMS) and application framework, has joined Figma.

, the open source content framework now integrated into Figma Make, teams can build and host those experiences with a built-in backend, then manage their content and data, all in one place.

With Payload, prompting an app in Figma Make also sets up the tools to store and manage its content and data, including a database, file storage, user login, and an admin panel. A designer can now prompt an experience using real content while a marketer adds and updates that same content through a built-in admin panel, and a developer customizes the app using Payload’s open-source framework. Each gets a workspace suited to their role, with granular permissions allowing teams to control who can change what.

Set up and host everything in Figma

Payload powers everything your app needs—content, media, permissions, workflows, versioning, APIs, and an admin panel—and Figma hosts it, so your content and data live in the same place as the designs that shape them.

Imagine your team is launching a delivery service. The website needs to explain the service and let prospective drivers apply. Alongside managing copy and images, your team needs a way to store submitted applications, review them, and track applicants through onboarding. Previously, your team might connect an external content management system (CMS) to the website to manage copy and images, and work with engineers to set up a way to store, review, and track driver applications.

Now, the website and the backend for storing and managing applications come together, including an admin panel where marketers update content and product teams review applicants. That means your team can spend more time building the website and keeping its content up to date, and less on setting up, connecting, and managing separate systems.

Customer snapshot: IBM

At IBM, lead visual and UX designer Noah Trevino tested whether Payload could make his team’s frequently updated internal websites easier to manage. He gave Figma his existing design screens and a list of the fields he needed, and got back a working draft his team could use to update content themselves. “Payload gave my team a content system anyone can manage, with version history built in, so those resources stay accurate and useful long after launch,” Noah says.

Give teammates a direct way to manage content and data

To manage routine updates, Payload now gives you an intuitive editing panel, so you don’t have to prompt your way through changes, leave Figma to go to a third-party CMS, or build a separate editing page. Through the editing panel, the team can create new articles, edit copy, tag content, swap media, reorder categories, review versions, and publish updates, all without opening a ticket or waiting on engineering.

Payload tip

Once your web app is published, you can quickly manage content by logging into your site and adding /admin.

For example, Figma marketer Seth Harris and his team are building a companion website for the Source Material YouTube series, so viewers can browse books and magazines featured in the episodes. They’ve set up Payload entries for each item’s title, cover image, and associated episode, along with custom fields for binding and cover finish that shape its appearance on an interactive 3D shelf. The admin panel gives the team a way to add items and update those details without using prompts to update each entry. If the team later needs to add a batch of catalog entries, they could upload a CSV rather than enter each item individually.

Keep your app’s API keys secure

Imagine your team wants visitors to sign up for a newsletter about new product arrivals. To send a confirmation email after someone signs up, your website needs permission to use your email service. That permission comes through an API key. Before Payload in Figma, you’d need to set up and connect a Supabase project to store that key securely. Now, you can store the key directly in Make’s settings, and Figma stores it securely so it isn’t exposed to visitors when the website is published. That means less setup to get confirmation emails working, while keeping the key private.

With Payload, content and data are no longer something your team builds around. Instead, they become the raw material that you design with, from the first prompt to what ships.

With Payload, your team has a place to keep its content current and support the features visitors rely on, with less separate setup along the way.

Payload is available on all plans, with access rolling out to all accounts over the coming weeks. The hosting infrastructure for Payload-backed Figma Make projects is currently in beta and free to use. We’ll announce pricing and packaging before it takes effect.

Learn more in the help center.