Publish, update, or unpublish a functional prototype or web app

Before you start

Who can use this feature

Figma Make is in open beta.

While in beta, Figma Make is rolling out in the coming weeks to users on all paid plans.

Requires a Full seat.

When you’re ready to share your functional prototype, web app, or interactive UI with the world, you can publish it. Publishing makes your functional prototype or web app available on the public web with its own dedicated URL.

After publishing it, you can make incremental changes to your functional prototype or web app, or unpublish the it to remove it from the public web.

You can also assign a custom domain to a web app. The number of custom domains you can assign is based on your plan. The limit is shared with Figma Sites.

Publish a functional prototype or web app

To publish your functional prototype or web app:

1. Open the Figma Make file that you want to publish.
2. In the upper-right corner, click Publish.
3. In the Publish modal, set a title.
4. Optionally, in the upper-right corner of the Figma Make interface, click Make settings to change additional settings for your site.
5. Click Publish.

After you click publish, your functional prototype or web app becomes available on the public web. Figma Make provides a randomly-generated public URL that you can use to access your published functional prototype or web app and share with others. The generated URL will look like this: three-random-words.figma.site

Once you publish your functional prototype or web app, the publishing window displays the following:

• The web app's URL, which is autogenerated by Figma. Click the URL to visit your published functional prototype or web app. You can now switch to using a custom domain if you prefer.
• The status is Published.
• A new field that shows the last published date.

Important: Please consult with a lawyer to ensure you understand your legal obligations when using images or publishing via Figma Make. Do not rely on these guidelines to make sure you are in compliance with the law.

You are responsible for any information you collect from users (like things uploaded to sites, or visitor information), and ensuring that data is managed compliantly.

Update a published functional prototype or web app

If you need to modify existing content, you can publish an update to your functional prototype or web app.

Any changes you make to your functional prototype, web app, or interactive UI will only appear after you update the published version. For example, if the interface of your web app changes, that change won’t appear on the published functional prototype or web app until you publish an update.

To publish changes, follow the same instructions in Publish a functional prototype or web app. Then, in the Publish modal, click Update.

Add a custom domain

If you want your published functional prototype or web app to have a URL other than the one randomly generated by Figma Make, you can assign the web app a custom domain. For example, by adding a custom domain, you could assign https://www.yourdomain.com as the URL for your published functional prototype or web app.

To assign a custom domain, follow the steps in Manage a custom domain for your site. The steps are the same for Figma Make.

Unpublish a functional prototype or web app

Unpublishing your functional prototype or web app will remove it from the public web. If you decide to republish later, Figma will reuse the same URL. To unpublish:

1. In the Figma Make file for the functional prototype or web app you want to unpublish, click Make settings in the upper-right corner.
2. Click Unpublish.

Publish modal

The Publish modal includes the current title, a URL, and the status (published or not published).

The Publish modal includes the following:

• Title: The title of your functional prototype or web app as it appears in browser tabs, search engine results, and social media. Adding a title helps people understand what site they viewing, improves SEO, and improves accessibility.

• URL: If the functional prototype or web app has never been published, an example URL is displayed. Otherwise, the actual URL for the published functional prototype or web app is displayed. When unpublished, the displayed URL doesn’t change, but is no longer active on the public web.

• Status: The default status is Not published. If the functional prototype or web app is live, you’ll see Published instead.

Make settings modal

There are a number of optional, advanced settings you can set before or after you publish your functional prototype or web app. To view the Make settings modal, in the upper-right corner of the Figma Make interface, click Make settings.

The Make settings modal is where you specify metadata and discoverability for your published functional prototype or web app. In the Make settings modal, you can see whether or not your functional prototype is published, publish and unpublish it, and set the following:

• Title
• Meta description
• Language
• Google Analytics ID
• Exclude all pages from search engine results
• Favicon
• Social sharing image
• Custom code for the site head and body

Title

Use the Title setting to specify a title for your published functional prototype or web app. The title appears in browser tabs, search engine results, and social media. Adding a title helps people understand what page they are on in their browser, aids SEO, and improves accessibility.

Meta description

Use the Meta description setting to provide a description of your published functional prototype or web app. A meta description is a short summary of your website’s or page’s content and is designed to attract users and improve click-through rates from search engine results pages (SERPs).

Language

Use the Language setting to define the primary language of content in your functional prototype or web app. Setting the language code for your functional prototype or web app improves accessibility and assists browser translation features by clearly indicating the primary language.

ISO language codes assign unique identifiers to languages. Some of the most common language codes include:

• ar – Arabic
• de – German
• en – English
• es – Spanish
• fr – French
• ja – Japanese
• hi – Hindi
• ru – Russian
• pt – Portuguese
• zh – Chinese

View a complete list of ISO language codes on Wikipedia.

Google Analytics ID

Use the Google Analytics ID setting to capture usage metrics with Google Analytics. Connect to a Google Analytics property to get insights into how people are using your published website.

Review the instructions from Google on how to find your Google Analytics ID.

Please note that you are responsible for ensuring that your functional prototype or web app complies with applicable laws, including any applicable to cookies, privacy and data collection.

Exclude all pages from search engine results

Enable the Exclude all pages from search engine results setting to instruct search engine robots not to index your functional prototype or web app or show it in search results.

Check the box to add a <meta name="robots" content="noindex"> tag to the header of your published functional prototype or web app.

Favicon

Use the Favicon setting to upload an image to use as a favicon. A favicon provides a small visual representation of your published functional prototype or web app in browser tabs, search results, and bookmarks. We recommend using a 32px x 32px image.

Social sharing image

Use the Social sharing image setting to upload an image that appears when your published functional prototype or web app is shared on social media. We recommend using an image that is 1200px wide by 630px tall.

Custom code for the site head and body

You can add custom code snippets at the start or end of your functional prototype or web app’s head or body tags.

For instance, loading critical tags like analytics in the head ensures they execute early, while non-critical elements like a chat widget can be placed at the end of the body to prevent it from slowing down the main content of your functional prototype or web app.