How do you connect a Webflow form to n8n?
Create a Webhook node in n8n, copy its production URL, and add a webhook in Webflow that fires on form submissions and posts to that URL. Then publish the n8n workflow so the production URL is live. Every new form submission on your published Webflow site will arrive in n8n as a JSON payload you can route anywhere.
This tutorial is for one specific reader. You run marketing on a Webflow site, your lead forms currently go to email or a spreadsheet, and you want them in n8n so you can enrich, score, and route them into a CRM like HubSpot. You are comfortable with no-code tools but you are not a developer.
I set up flows like this for B2B clients regularly, and the steps are simple. The parts that trip people up are the difference between test and production URLs, forms that fire for the wrong form, and retries that create duplicate leads. I will cover each one.
What do you need before you start?
You need a published Webflow site with at least one form, an n8n account or a self-hosted n8n instance, and access to your Webflow site settings. If you plan to send leads onward, have your CRM credentials ready too. Give the form a clear, unique name in the Webflow Designer, because you will filter on it later.
The form name matters more than it seems. Many Webflow sites have several forms, such as a contact form, a newsletter signup, and a demo request. If every form fires the same webhook, your n8n workflow will receive newsletter signups and try to treat them as sales leads.
If you are still deciding between n8n Cloud and running it yourself, read my take on whether a small team should self-host n8n first. The webhook setup is the same either way, but your production URL will look different.
How do you set up the Webhook node in n8n?
Create a new workflow in n8n and add a Webhook node as the trigger. Set the HTTP method to POST, because Webflow sends form data as a POST request. Leave the path as generated or give it a readable name. n8n then shows two URLs for the node: a test URL and a production URL.
n8n's documentation explains the difference clearly. When you call the test URL, n8n displays the incoming data inside the workflow editor, which is ideal for building. When you use the production URL, n8n does not display the data in the editor. You see those runs in the workflow's Executions tab instead.
Start with the test URL so you can see the real payload shape. You will switch to the production URL once the workflow works. Mixing these two up is the single most common reason a Webflow to n8n setup "works in testing and then stops".
How do you add the webhook in Webflow?
In your Webflow site settings, open the integrations area and add a new webhook. Choose the form submission trigger and paste your n8n URL as the destination. Webflow's developer docs name this trigger form_submission. Save it, then submit a test entry on your published site to confirm data reaches n8n.
Menu labels in the Webflow dashboard change from time to time, so look for the webhooks section under your site's integration settings if the exact names differ. Webflow's developer documentation links to its help center for the current dashboard steps.
One important detail from Webflow's developer docs: webhooks created through the dashboard do not include the request headers needed to validate request signatures. For most marketing forms that is acceptable. If you need signature verification, the webhook has to be created through the Webflow API or an OAuth app instead.
How do you stop other forms from triggering the workflow?
Filter by form name. Webflow's developer docs say the form_submission trigger supports a filter for the name of the form you want notifications for, which is useful on sites with several forms. If you cannot set that filter where you create the webhook, add an IF node in n8n that checks the form name in the payload.
Webflow's form submission payload includes the form's name, the site ID, the submitted data, the submission time, and an ID for the event, among other fields. The name field is what your filter checks. The data field holds what the visitor typed into each input.
I add the n8n check even when the Webflow filter is set. It costs nothing and protects you if someone renames a form or adds a new one later. A workflow that silently starts processing the wrong form is hard to notice until a sales rep asks why newsletter signups are showing up as leads.
How do you map the form fields in n8n?
Add a Set or Edit Fields node after the Webhook node and pull the values you need from the payload's data object. Rename them to clean, consistent names such as email, first_name, company, and message. Downstream nodes should read only these clean fields, never the raw payload.
This middle step saves you later. If a designer renames a field on the Webflow form, you fix one mapping node instead of every node that uses the value. It also makes the workflow readable for whoever maintains it after you.
Normalize as you map. Trim spaces, lowercase the email address, and keep the original submission time from the payload. Those small steps prevent duplicate contacts and messy CRM data later in the flow.
How should the workflow respond to Webflow?
Respond quickly and do slow work afterward. n8n's Webhook node can respond immediately, respond when the last node finishes, or respond through a Respond to Webhook node. For form leads, responding immediately or right after storing the data is the safer choice, because Webflow expects a fast response.
Webflow's developer docs say that when it gets a non-200 response, it retries the webhook up to three more times before treating the request as failed. Repeated failures can lead to the webhook being deactivated, with an email notification. That is a good reason to keep the response path short and reliable.
Retries also mean the same submission can arrive more than once. Use the event ID in the payload as a duplicate check before you create anything in your CRM. I explain that pattern in detail in how to retry a failed webhook without creating duplicates.
How do you send the lead to your CRM?
Add your CRM node after the mapping and duplicate check. For HubSpot, search for an existing contact by email first, then update it if found or create it if not. Add the form name and submission time as properties so sales can see where the lead came from and when.
This is also the point to add enrichment or scoring if you need it. Keep each step small and named clearly, so the workflow reads like a sentence: receive, filter, map, check for duplicates, enrich, write to CRM, notify.
Add an error path before you call it done. If the CRM step fails, the lead should land somewhere a human will see it, such as a Slack channel or a backup sheet. My guide to writing error paths in an n8n workflow covers how I set that up.
How do you go live and test the setup?
Switch the Webflow webhook to the production URL from your n8n Webhook node, then publish the workflow. n8n's docs say it registers the production webhook when you publish the workflow. Submit a real test entry on your live site, then check the Executions tab in n8n and the new record in your CRM.
Run three tests before you trust it. Submit the right form and confirm a clean record. Submit a different form and confirm the filter stops it. Then submit the same test entry twice and confirm you still have one contact, not two.
Write down the setup in one short note: the form name, the webhook trigger, the n8n workflow name, the production URL, and who owns it. The next time a form stops sending leads, that note will save an hour of searching.
What should you do next?
Build the workflow with the test URL, map your fields, add the form filter and duplicate check, then switch to the production URL and publish. Run the three tests. Once one form works end to end, add your other forms as separate branches or separate workflows, each with its own filter and owner.
A form to CRM flow is the first automation most B2B teams need, and it is worth getting right. Every other lead routing, scoring, and reporting step depends on leads arriving cleanly and only once.
If you want help connecting your Webflow forms to n8n or HubSpot, or reviewing a setup that keeps dropping leads, reach out. This is exactly the kind of build I do.
Get found, cited and the back office automated
Let's make your site the source AI engines quote and wire up the systems behind it.
Read more blogs
Let's get your website found and cited by AI
Tell me what you're working on, whether AI search is skipping your product, your back office is buried in manual work, or you need a build that does both.