N8N Chat UI
Webflow icon
Webflow

N8N Chat UI for Webflow

The official Webflow app for N8N Chat UI. Add a customizable AI chat widget to your Webflow site and connect it to your n8n workflows, with no custom code to paste. Free to add from the Webflow Marketplace.

Get it on the Webflow Marketplace

Requirements

  • A Webflow account with access to the site you want to edit
  • An N8N Chat UI account and a widget connected to your n8n workflow

What you get

Direct n8n integration
Connect the chat widget to your n8n workflows, so every conversation can trigger the automations you have already built.
Custom styling and branding
Fully customizable visual styling, so the chat matches your Webflow site and your brand.
Streaming, quick replies and prompts
Real-time streaming with rich text support, plus dynamic quick replies and initial prompts.
Page exclusions
Hide the widget on specific pages, such as checkout or legal pages, by entering their URL paths.

Why add N8N Chat UI to Webflow

The Webflow app puts a customizable AI chat interface on your site and connects your visitors to your n8n workflows. Use it for 24/7 AI-powered customer support, to capture and qualify leads automatically, or to trigger your own automations, without writing code. See the customer support chatbot use case for one example.

Installation

The app is free to add from the Webflow Marketplace. Install it, copy your widget ID from the Embed tab of your widget at n8nchatui.com, paste it into the app, and publish your site. You need an N8N Chat UI account to create and configure widgets. The app asks for permission to read and write site data and custom code, which it uses to add the widget to your pages.

For the full walkthrough, including page exclusions, read the Webflow install guide. New to N8N Chat UI? Read how standalone and managed widgets differ.

Need help?

Questions about the Webflow app? Email [email protected].

Related

Docs

Installing n8n ChatUIWidget on Webflow

Install the N8N Chat UI app from the Webflow Marketplace, paste your widget ID, set optional page exclusions, and publish your live chat.

Blog

How to Secure Your n8n Chatbot

A step-by-step guide to securing your n8n chatbot with authentication, domain restriction, geofencing, and rate limiting, with no code required.

Blog

Standalone vs. Managed Chat Widgets for n8n

A clear breakdown of the two widget modes available on n8nchatui.com: how they differ, what each one offers, and which one fits your use case.

Use Case

Customer Support Chatbot

Answer common questions instantly, hand off the hard ones to a human, and keep every reply on-brand — powered by the n8n workflows you've already built.

Ready to bring this to your site?

Start free with 100 credits, no card required. A secure, branded chat widget for your n8n workflow, live in minutes.

Start building free