Build full-stack web apps with Webflow AI

Use the Webflow AI Assistant to generate web apps and deploy them to Webflow Cloud.

With the Webflow AI Assistant, you can generate web apps aligned to your site’s design system from a simple text prompt. You can connect your app to your CMS content or import components to keep it consistent with the rest of your site. You can refine your app using the AI Assistant or edit the code yourself, then deploy it to Webflow Cloud and host it on your custom domain.

What is a web app?

A web app is a self-contained application that runs in the browser and responds to user input. Unlike static pages, web apps can include logic and interactivity, making them feel more like software than content. Common examples include:

• Pricing estimators

• Store locators

• Booking tools

• Dashboards

In Webflow, web apps are generated and managed in the App Gen panel. These are standalone applications you can build and deploy alongside your site, with access to your site’s design system and CMS data.

Unlike smaller code components, which you add into a page, web apps are deployed separately to Webflow Cloud and run alongside your site.

Generate a web app

Getting started

To generate a web app, you’ll need to open an existing site in Webflow, create a new one, or generate one using the AI site builder. To get started:

1. Click the “App Gen” icon in the top bar

2. Enter a prompt to describe the app you want to build

3. (Optional) Connect your app to your CMS collection(s) and components by clicking the “Add” button

4. Click the “Submit” button

The Webflow AI Assistant generates your app based on the prompt you provide. From there, you can refine it with additional prompts, edit the code directly, or deploy your app to Webflow Cloud.

Previewing your app

When your app is generated, a live preview opens right within Webflow. You can toggle between the preview and your app’s code using the Code/Preview toggle. If your latest changes aren’t showing in the preview, click the “Refresh” button to reload your app. You can also click the “Open in a new tab” icon to view the preview in a separate browser tab.

Using variables

Apps generated with the Webflow AI Assistant include their own variables collection for styles such as colors and spacing. The Assistant creates a variables collection automatically when you generate an app, and you can edit these variables in the Variables panel from the left toolbar to adjust your app’s styles.

Refining your app with the Webflow AI Assistant

Once you’ve generated your app, you can keep working with the Webflow AI Assistant to refine it. Enter follow-up prompts to add new features, change the layout, or adjust how your app works. You can also prompt the Assistant to fix any issues you find in the preview. The best results come from working iteratively — start with a simple version of your app, then continue refining it step by step until it meets your needs.

Edit your app’s code directly

If you’re working with a developer, you can extend or customize your app further by updating the code generated by the Webflow AI Assistant. Use the Navigator in the left toolbar to browse your app’s folders and files, open the code in the built-in editor, and make changes. Additional developer tools are available at the bottom of the panel — Dev Server, Terminal, and Deployment.

Deploying your app

Once you’re ready to make your app live, you can deploy it directly to Webflow Cloud. To deploy your app:

1. Click Deploy

2. Click Deploy and publish

Deploying your app makes it live on your Webflow staging domain and/or custom domain (e.g., yourdomain.com/app-path), if you’ve connected one. Deployment may take a few minutes to complete.

You can change the app path (i.e. URL slug) at any time. To change your app’s path:

1. Click the “App Gen” icon in the top bar

2. Open the Apps panel in the left toolbar

3. Hover over your app

4. Click the “settings” icon

5. Enter your desired app path

6. Click Save

7. Refresh your browser tab

You can deploy your app without republishing your site, unless:

• your site has never been published

• your site hasn’t been published since the app was first created

• you change the app path (slug)

In these scenarios, your site is automatically published so your app is available on its path.

FAQs

How does App Gen pricing work during beta?

App Gen is free for all users while it’s in public beta. To maintain reliable performance for everyone, Webflow may temporarily limit usage if there’s unusually high demand. Webflow Cloud hosting is billed separately — you can learn more on our Webflow Cloud page. If you want to deploy an app to a custom domain, you’ll need to upgrade to a paid Site plan.

How does App Gen pricing work after general availability (GA)?

When App Gen moves from beta to GA, you’ll need Webflow AI credits to use it. Free and paid Workspaces will receive a set number of credits each month at no additional cost. If you’re part of a paid Workspace, you can also buy extra credit packs. Credits are shared across all users and sites within the same Workspace.

Will other Webflow AI features use Webflow AI credits?

As we continue expanding Webflow AI, some features — but not all — will require Webflow AI credits.

How will Webflow communicate future changes to credits, pricing, or eligibility?

Webflow intends to provide advance notice and publish details in early 2026. Updates will be shared through the Webflow pricing page, in-product messages, and Help Center articles.