Designer Extensions

A Designer Extension creating elements on the canvas.

Designer Extensions are web applications that run directly inside the Webflow Designer. They allow you to create powerful new tools that integrate seamlessly with a user’s workflow, helping them design, create, and optimize their sites faster than ever.

What you can build

Using the Designer APIs, you can build extensions that programmatically interact with a user’s design and content in real-time. This opens up a world of possibilities for workflow automation and creative tooling.

Automate layout and content creation

Generate complex components, populate data from third-party sources, or build entire page structures with a single click.

Manage design systems

Create tools that allow users to apply and maintain consistent branding, manage variables, and swap themes.

Streamline asset management

Build extensions that connect to external asset libraries, optimize images, or automate asset organization.

Create dynamic site structures

Programmatically add and organize pages and folders, perfect for sites with complex information architecture.

How they work

Designer Extensions are single-page applications that run inside a secure iframe within the Webflow Designer. They use Webflow’s client-side Designer APIs to communicate with the Designer, allowing your app to perform actions that would typically require manual user intervention. For more advanced use cases, your extension can also integrate with your own backend services and third-party APIs including Webflow’s Data APIs.

The development workflow

From your first line of code to a public Marketplace launch, here’s an overview of the development process.

1

Register your App in Webflow

Before you can start building, you need to register a new app within your Webflow Workspace settings.

2

Create a Designer Extension from the CLI

Use the Webflow CLI to scaffold a starter project and run a local development server for live testing.

3

Build with the Designer APIs

The Designer APIs are how your app will interact with the Webflow canvas, providing a robust interface to control the Designer.

4

Publish to your Workspace

When you’re ready, upload your extension to Webflow to share it with your team for testing and internal use in your Workspace.

5

Submit to the Marketplace

Share your creation with the world by submitting it to the Webflow Marketplace.