Guides
Step-by-step guides: add a working form to any site
Answer-first tutorials for connecting HTML, WordPress, React, Next.js, Vue, Svelte, Astro, Hugo, Jekyll, Webflow, Framer and AI-built sites to a form backend — plus spam, Sheets, Slack and Discord recipes.
HTML
HTML form without a backend
Make a plain HTML contact form send emails without PHP, Node or a server — by pointing it at a hosted form backend. Copy-paste code included.
Learn moreNext.js
Next.js contact form
Add a working contact form to a Next.js App Router site without writing a route handler, server action or email integration. Works with static export.
Learn moreHTML
Send HTML form to email
Make an HTML contact form send email without PHP or a server. Why mailto fails, copy-paste code that submits the form to email, subject, reply-to and spam.
Learn moreReact
React contact form
A copy-paste React contact form component that sends submissions to your inbox via a form backend — no Express server, no EmailJS keys in the browser.
Learn moreWordPress
WordPress form without a plugin
Add a fast, spam-protected contact form to WordPress with a Custom HTML block — no Contact Form 7, WPForms or SMTP plugin required.
Learn moreAstro
Astro contact form
Add a working contact form to a static Astro site with zero JavaScript — or as an island with inline success messages.
Learn moreVue
Vue contact form
A Vue 3 single-file component that submits to a hosted form backend with loading, success and error states — no server needed.
Learn moreNuxt
Nuxt contact form
Add a contact form to Nuxt 3 or 4 that works with nuxt generate and static hosting by posting directly to a form backend.
Learn moreSvelte
Svelte & SvelteKit contact form
A Svelte 5 contact form component using runes that submits to a hosted form backend — works with adapter-static.
Learn moreHugo
Hugo contact form
Add a working contact form to a Hugo static site with a partial and a shortcode — no server, no JavaScript required.
Learn moreJekyll
Jekyll contact form
Add a contact form to a Jekyll site (including GitHub Pages) with an include file and a form backend.
Learn moreGitHub Pages
GitHub Pages contact form
GitHub Pages only serves static files. Here's how to add a working, spam-protected contact form anyway.
Learn moreWebflow
Webflow forms
Point your Webflow forms at a custom form backend to email submissions, filter spam and send them to Google Sheets, Slack or webhooks, keeping your design.
Learn moreFramer
Framer form backend
Use a Framer code component to send form submissions to FormSubmit — emails, Slack, Sheets and webhooks without Framer form limits.
Learn moreGatsby
Gatsby contact form
Add a contact form to a Gatsby site without Gatsby Functions by posting directly to a form backend.
Learn moreEleventy
Eleventy contact form
Add a contact form to an Eleventy site using global data and a Nunjucks include, powered by a hosted form backend.
Learn moreNetlify
Netlify static site form
Use FormSubmit instead of or alongside Netlify Forms for static sites — framework-agnostic, with webhooks, Sheets and spam protection on every plan.
Learn moreVercel
Vercel site form
Add a contact form to any Vercel-hosted site — static or Next.js — without serverless functions, email providers or databases.
Learn moreAI builders
Forms for AI-built sites
AI website builders generate beautiful forms that don't send anywhere. Here's how to connect them to a real backend with one prompt.
Learn moreHTML
HTML form action
How the HTML form action attribute works: method GET vs POST, enctype, target, formaction, what happens on submit, and where action should point.
Learn moreFile uploads
File upload form (HTML)
Build an HTML file upload form with single or multiple file uploads, accept filters and size limits. Files are stored privately, with no backend code.
Learn moreJavaScript
Submit form with JavaScript
How to submit a form with JavaScript: form.submit() vs requestSubmit(), AJAX form submission with fetch and FormData, JSON, errors, React and jQuery.
Learn moreGoogle Sheets
Form to Google Sheets
Link a form to a Google Sheet: send HTML, Webflow, Framer or WordPress form submissions to Google Sheets automatically. No Zapier or Apps Script needed.
Learn moreHTML
Contact form without PHP
How a PHP email form works, why mail() causes spam-folder, security and hosting problems, and how to run a contact form without PHP instead.
Learn moreSlack
Form to Slack
Post every contact form, lead or support request to a Slack channel in real time using an Incoming Webhook and FormSubmit.
Learn moreDiscord
Form to Discord
Get a Discord embed in any channel whenever someone fills your website form — perfect for communities, game studios and open-source projects.
Learn moreSpam
Stop form spam
A practical, layered approach to form spam — honeypots, timing checks, content filters, allowlists and captchas — and how to set each up.
Learn moreSpam
hCaptcha HTML form
Add hCaptcha to a plain HTML form with server-side token verification and no backend code. Includes fetch, invisible mode, React and alternatives.
Learn moreNetlify
Netlify Forms not working
Netlify Forms not working? Fix form 404s, undetected React and Next.js forms, missing submissions, spam filtering, AJAX posts and file upload limits.
Learn moreHTML
HTML form elements
A reference to every HTML form element: form, label, input types, textarea, select, button, fieldset, datalist and output, with a complete working example.
Learn moreHTML
HTML textarea
How to use a textarea in an HTML form: rows, cols, maxlength and wrap, styling with CSS, auto-grow, a character counter, and sending the message to email.
Learn moreHTML
HTML radio buttons
How HTML form radio buttons work: grouping by name, default and required, yes/no questions, horizontal CSS, custom styling and getting the value in JavaScript.
Learn moreHTML
HTML checkbox
How HTML form checkboxes work: consent boxes, multiple checkboxes with one name, unchecked values, required, indeterminate, styling and JavaScript.
Learn moreHTML
HTML select dropdown
How to build an HTML select dropdown: option and optgroup, a placeholder option, required, multiple, datalist for free text, CSS styling and JavaScript.
Learn moreHTML
Fieldset and legend
How to use fieldset and legend in HTML forms: grouping radio and checkbox fields, disabled fieldsets, CSS styling quirks and splitting long forms into sections.
Learn moreHTML
HTML input types
Every HTML input type in one table, with mobile keyboard behaviour, validation attributes, autocomplete values and hidden inputs for form control fields.
Learn moreYour form backend is 60 seconds away
Sign up with Google or email, create a form, paste the endpoint. Free forever for small sites — no credit card.