Contact form for Webflow websites
Webflow's built-in forms cap free submissions and gate webhooks behind paid plans. Point your existing Form Block at the splitforms endpoint instead — same drag-and-drop designer, real backend, 1,000 submissions/month free, signed webhooks included.
What your Webflow contact form actually looks like.
Drop-in form backend with spam filtering, signed webhooks, and a real submissions dashboard. The same code in this preview is what you copy into your Webflow project — no SDK, no plugin, no PHP.
- ✓1,000 submissions per month, free forever
- ✓Honeypot + AI spam classifier on every plan
- ✓Signed webhooks to Slack, Discord, your server
Ship a Webflow contact form without a backend.
No SDK, no PHP, no plugin. Your form posts standard FormData to one URL — submissions land in your inbox.
Get your free access key
Verify your email and your access key is generated instantly. Free for 1,000 submissions per month, forever.
By signing up, you agree to our terms and privacy policy.
Drop in the Webflow code
Copy the Webflow snippet on the right and paste it into your project. Replace YOUR_ACCESS_KEY with the key from step 1.
Submissions land in your inbox
Hits your dashboard and email in seconds. Forward to Slack, Discord, Sheets, Notion, or any signed webhook URL.
Try it now — no signup, no key.
This is a styled HTML preview of what your Webflow form will look like. Submitting opens a confirmation, no real request is sent.
Your Webflow form posts FormData to /api/submit. Splitforms validates the access key, runs the spam classifier, and forwards the parsed submission to your inbox plus the dashboard.
- →14ms median round-trip from the edge.
- →Honeypot + classifier, no CAPTCHA.
- →Per-domain key locking out of the box.
{
"access_key": "sk_live_4f9a_••••",
"name": "Maya Iyer",
"email": "maya@studio71.co",
"message": "…"
}How to ship this without regrets.
Five rules that make the difference between a form that works in the demo and a form that survives launch traffic.
- 01
Use the native Form Block in Designer, not an embed. Embeds work but break Designer's preview rendering and lose drag-and-drop styling.
- 02
Set the redirect field to a Webflow page slug like `/thanks`. Build the page in Designer, then it renders with your normal layout/header/footer — no separate template needed.
- 03
Lock the access key to your published `.webflow.io` subdomain AND your custom domain in the splitforms dashboard. Webflow staging URLs are different from your live URL.
- 04
Disable Webflow's CAPTCHA — the honeypot + classifier in splitforms covers spam without a CAPTCHA challenge that hurts conversion.
- 05
If you have multiple forms (contact, newsletter, demo request), use a single access key and the splitforms dashboard's filter by form-name to organize. No need for separate keys per form.
What bites people who skip the docs.
Worth a 60-second skim before you ship to production. Each one has caused a Webflow support ticket at least once.
Webflow strips custom hidden inputs from native Form Blocks
If you add <input type="hidden" name="access_key"> directly in Designer's Form Block, Webflow ignores it on publish. Use the Form Block's settings panel: Form Settings → Form Name + add custom attribute. Or use an Embed element with raw HTML if you need full control.
Default action URL gets reset on every Designer save
Setting the Action URL to https://splitforms.com/api/submit in the Form Block sometimes reverts to Webflow's default after a publish. The fix: lock it in by adding a custom attribute action to the form element (Settings → Element Settings → Custom Attribute).
Method must be set to POST in the form's settings, not the URL
Webflow forms default to GET. Open the form's Settings panel, change Method to POST. If you forget, the submission posts your fields as URL query params — splitforms returns a 405 Method Not Allowed.
Webflow's success/error elements still trigger on AJAX submit
Webflow auto-shows the .w-form-done div on a 2xx response. That's good — but if you also set up a redirect field in splitforms, the user sees the success message for ~80ms before the redirect fires. Either remove the success div or skip the redirect field.
CAPTCHA conflict when Webflow's hCaptcha is enabled
If you've enabled Webflow's built-in hCaptcha for the form, Webflow blocks the submission client-side before splitforms is reached. Disable Webflow's CAPTCHA — splitforms has its own honeypot + classifier, no need for both.
Webflow auto-injects an XMLHttpRequest interceptor that strips your access_key
Webflow's runtime (webflow.js) attaches a global submit listener that serializes form fields and POSTs them via XHR — and any field name it doesn't recognize from the Designer schema is dropped before the request leaves the browser. The access_key hidden input you added in an Embed often gets filtered. Workaround: instead of a hidden <input>, append the key to the form action URL as a query param (?access_key=…) or add wf-form to a class allowlist in the form's settings to let Webflow pass through unknown fields verbatim.
How Webflow handles forms without splitforms.
The shape of the problem before splitforms enters the picture — and the gap it fills for Webflow specifically.
Webflow's built-in Forms feature delivers submissions to your Webflow project dashboard and emails them — but the free Site plan caps submissions (50 per site, lifetime, on legacy plans) and webhooks are gated behind the Workspace plan ($24/mo+). Worse, the form fails silently if you exceed the cap: users see the 'success' state, your inbox gets nothing. There's no API to inspect submissions programmatically below the Workspace tier, and CMS-driven forms inherit the same caps. Native is fine for a personal portfolio with three submissions a year; for any real lead capture, you need an external endpoint. Splitforms is that endpoint without the plan upgrade.
Two ways to ship splitforms on Webflow.
Pick the pattern that matches your constraints — JS budget, key-exposure tolerance, server-side opacity. Both produce the same result.
Pattern A — native Form Block with overridden action URL
Use Webflow's drag-and-drop Form Block — keep the styling, structure, and Designer integration. In Form Settings, change Action to https://splitforms.com/api/submit and Method to POST. Add a hidden access_key field via the form's settings panel. Submissions skip Webflow's backend entirely.
Pattern B — Embed element with raw HTML
If you need full control over markup (custom honeypot, file upload, multi-step), drop an Embed element on the canvas with raw HTML. Skips Webflow's form widget entirely. Useful for forms that don't fit the Designer's mental model.
Shipping Webflow + splitforms to production.
Host-specific gotchas, env-var conventions, and the boring-but-load-bearing details for putting this on the public internet.
Webflow hosts your published site on its own CDN — there's no Vercel/Netlify config to worry about. The form posts cross-origin to splitforms regardless. Disable Webflow's built-in hCaptcha for the form (Form Settings → Spam Filter → Off) — it intercepts submissions client-side before splitforms is reached. Lock the splitforms access key to BOTH your *.webflow.io staging URL and your custom domain in the dashboard; Webflow serves both, with different Origin headers. Custom code embeds count toward Webflow's per-page code limit (10 KB) — keep raw-HTML Embed forms tight if you have multiple per page.
splitforms vs native webflow.
What you get for free vs what you build, pay for, or do without.
Things developers ask before they integrate.
Direct answers, no marketing fluff. Missing one? Email hello@splitforms.com.
Ship your Webflow contact form in 60 seconds.
1,000 free submissions per month. No credit card. Lock the access key to your domains, paste the snippet, watch submissions land in your inbox.
