Building a Designer Extension

This guide will walk you through the complete setup for creating a Designer Extension. By the end of this guide, we’ll have completed the following steps:

  1. Designer Extensions overview
  2. Designing a User Interface
  3. Interacting with the Webflow Designer
  4. Quick Setup with an Example App
  5. Publishing and distribution
  6. UI Guidelines

If you had any further questions, please email us at [email protected]

Prerequisites

To successfully follow along with this guide, please ensure your system meets the following requirements:

  • Node.js 16.20 or later
  • macOS, Windows (including Windows Subsystem for Linux), and Linux are supported
  • A Webflow site for development and testing
  • A registered Webflow App that's installed to your test site. If you haven't set up an App yet, please follow the Registration and Installation guide.

Tools:

  • Terminal
  • Code Editor
  • Browser

Knowledge of:

  • Web Applications
  • HTML, CSS
  • Javascript / Typescript

Quickstart

Want to jump in right away? Check out our Designer Extensions quickstart guide.


What’s Next

Now that your App is set up in Webflow, it's time to start developing.