Form backend guides — working code, free backend.
Tutorial guides for building HTML forms — semantic markup, native validation, AJAX submission, jQuery/React/Bootstrap validation, captcha alternatives. Every guide ships copy-paste working code with the splitforms backend pre-wired (free for 500 submissions/month).
The foundations — semantic markup, native validation, the action attribute.
HTML Form — How to Build and Submit Forms in HTML
Semantic HTML, native validation attributes, accessibility-first labels, and the modern way to handle the submission — POSTing to a backend like splitforms instead of writing one.
Read guide →HTML Form Examples — Copy-Paste Working Code for 2026
Eight working HTML form examples — contact, registration, multi-step, file upload, donation, NPS survey, feedback widget, and a multi-column layout. Copy, paste, ship. The backend is splitforms (free for 500 submissions/month).
Read guide →Free HTML Form Templates — Copy-Paste Ready (2026)
Production-ready HTML form templates with the backend wired in. No download — copy from the page, paste into your site, replace one access key. Free for 500 submissions/month.
Read guide →Simple HTML Form — The Smallest Working Contact Form
Ten lines of HTML. No CSS. No JavaScript. No framework. Real working contact form with submissions going to your dashboard and owner email included.
Read guide →HTML Form Action — What It Does and How to Use It
The `action` attribute on a `<form>` tells the browser where to send the form data when the user submits. Complete reference plus the common gotchas (absolute vs relative URLs, the formaction override, mailto: action, POST vs GET).
Read guide →HTML Form Code — Production-Ready Snippets for 2026
Six HTML form code snippets you can actually ship — minimal contact, registration, file upload, multi-step, AJAX, and dark mode. Every snippet POSTs to splitforms (free 500/month) with no PHP or server setup.
Read guide →HTML Form Design — Modern Patterns for 2026
Modern HTML form design is mostly subtraction — single-column vertical layout, generous spacing, visible labels above inputs, native validation styling, dark mode by default. The form below ships these conventions, pre-wired to splitforms.
Read guide →HTML Form Layout — Single Column, Multi-Column, and Multi-Step
Three form layout patterns covering 95% of cases — single-column (the default), responsive multi-column via CSS Grid auto-fit, and multi-step wizards. Working code for each, with notes on when to use which.
Read guide →HTML Forms for Practice — Exercises with Working Solutions
Six HTML form exercises with working solutions — contact form, registration with validation, file upload, multi-step wizard, accessibility audit, dark-mode redesign. Every solution POSTs to splitforms's live backend so you see real submissions.
Read guide →Contact, registration, job application, donation — the common form shapes.
Registration Form in HTML — Working Code for 2026
A registration form with name, email, password, and confirm-password fields — semantic HTML, native validation, accessibility-first labels. POSTs to splitforms (free 500/mo). The form code, the validation rules, and the backend integration on one page.
Read guide →Contact Form HTML — Copy-Paste Working Code
Drop-in HTML contact form with the backend already wired up. Name, email, message, honeypot — the four fields every contact form needs. POSTs to splitforms (free for 500 submissions/month) so you skip the PHP runtime, SMTP setup, and spam filter.
Read guide →Job Application Form in HTML (with File Upload for Resume)
A working HTML job application form with file upload for resume + cover letter, plus standard fields (name, email, role, LinkedIn, why-join). POSTs to splitforms; with Storage connected, file attachments are retained privately with signed links.
Read guide →Signup Form in HTML — Working Code with Validation
Email, password, password-confirm, terms checkbox. Native validation handles required + format; 5 lines of JS handle the password match. POSTs to splitforms (free 500/month).
Read guide →Application Form in HTML — Working Code Template
A general-purpose HTML application form — personal info, experience/qualifications, references, optional file upload. Adaptable for membership, program, grant, scholarship, or any 'apply for X' use case.
Read guide →Enquiry Form in HTML — Working Code for Service Businesses
An HTML enquiry (or inquiry) form for service businesses — service interested in, budget range, project timeline, contact details. Captures qualifying info before the first call so you don't waste time on bad-fit leads.
Read guide →Donation Form in HTML — Working Code for Nonprofits
An HTML donation form with preset amounts ($25/$50/$100), custom amount, one-time vs recurring toggle, and donor info. Capture the intent with splitforms; process the payment via Stripe Payment Element on the next page.
Read guide →Feedback Form in HTML — Working Code for Product Teams
An HTML feedback form for product teams — 1-5 rating, category (bug / feature request / praise / other), free-text, optional contact info if the user wants a reply.
Read guide →Order Form in HTML — Working Code Template
An HTML order form — product list with quantities, shipping address, payment method (intent captured here, processed in Stripe Checkout). Free backend via splitforms; pair with Stripe for the actual transaction.
Read guide →Warranty Form in HTML — Working Code Template
A warranty registration form — product model, serial number, purchase date, receipt upload, customer info. POSTs to splitforms; webhook into your warranty-tracking system or CRM.
Read guide →RMA Form in HTML — Return Merchandise Authorization Template
An HTML RMA (return merchandise authorization) form — order number, product, reason for return, condition, photo of the issue, customer info. POSTs to splitforms; webhook into your warehouse system or CRM.
Read guide →Shipping Form in HTML — Working Code Template
An HTML shipping form — recipient name, address (with proper autocomplete), shipping method, delivery instructions. Browser autofill works correctly so customers complete it in two taps.
Read guide →Radio buttons, buttons, dropdowns, textareas, file inputs.
HTML Radio Button — Working Code and Common Patterns
A radio button is `<input type="radio">`. Multiple radios with the same `name` attribute form a group; only one can be selected at a time. Complete reference with code, common gotchas, and a working form.
Read guide →HTML Button — Types, Attributes, and Common Patterns
An HTML button is `<button>` (preferred) or `<input type="button">` (legacy). The `type` attribute determines what it does inside a form — submit (default), reset, or button (no default action). Complete reference plus working code.
Read guide →HTML Dropdown — Select Element Reference and Patterns
An HTML dropdown is `<select>` containing `<option>` elements. Native dropdowns are the default — they're accessible, mobile-friendly, and require zero JavaScript. Reach for custom dropdowns only when the native UX is genuinely insufficient.
Read guide →HTML Textarea — Multi-Line Text Input Reference
An HTML textarea is `<textarea>` — a multi-line text input. Unlike `<input>`, it has no `type` attribute (it's its own element). Configurable rows, max length, wrap behavior, and CSS-controlled resize.
Read guide →HTML File Input — Upload Field Reference and Patterns
An HTML file input is `<input type="file">`. The `accept` attribute filters the file picker; `multiple` allows multi-file selection. The form needs `enctype="multipart/form-data"` for files to actually upload — the #1 forgotten step.
Read guide →HTML Checkbox — Reference and Common Patterns
An HTML checkbox is `<input type="checkbox">`. Use for single yes/no questions (terms of service) and for multi-select groups (interests, preferences). Multiple checkboxes with the same `name` form an array on submission.
Read guide →HTML Input Types — Complete Reference (2026)
HTML supports 22+ input types. Use the right type for each field — mobile keyboards adapt, native validation fires, accessibility tools announce correctly. Here's the complete reference with when to use each.
Read guide →jQuery, React Hook Form + Zod, Bootstrap 5, server-side.
jQuery Form Validation — Working Code for 2026
Working jQuery form validation using the jquery-validate plugin — required fields, email format, password confirmation, custom rules. Complete code, common gotchas, and how to wire it to a free splitforms backend.
Read guide →React Form Validation — Working Code (React Hook Form + Zod)
Modern React form validation uses React Hook Form for state management and Zod for typed schemas. Working code with inline errors, password confirmation, async submission to splitforms.
Read guide →Bootstrap Form Validation — Native HTML + Bootstrap 5
Bootstrap 5 ships form validation as a thin layer on top of native HTML — no jQuery, no plugin, no JavaScript validation library. Just `required` attributes, `.was-validated` class, and `.invalid-feedback` divs.
Read guide →Tailwind CSS Form Validation — Working Code
Tailwind ships `invalid:`, `valid:`, `focus:`, and `placeholder-shown:` variants that map directly to native HTML validation pseudo-classes. No JavaScript validation library — just utility classes and the platform.
Read guide →Server-Side Form Validation — Why It's Non-Optional
Client-side validation is for UX; server-side validation is for security. Why you need both, what to check server-side, and how splitforms validates every submission so you don't have to write it yourself.
Read guide →Submit forms via fetch (vanilla) or $.ajax (jQuery) without a page reload.
Submit Form with AJAX — Working Code for 2026
Submit a form via AJAX (no page reload) using vanilla JS fetch — and the equivalent jQuery $.ajax for legacy codebases. Both POST to splitforms's free /api/submit endpoint.
Read guide →Submit Form with JavaScript — Vanilla JS Reference
Submit a form with vanilla JavaScript — fetch + FormData + four-state status UI. No framework, no library, no jQuery. ~15 lines of code total.
Read guide →jQuery Submit Form — Legacy Codebase Reference
Submit a form with jQuery `$.ajax` — for legacy codebases that already require jQuery. Same mechanics as vanilla JS fetch, different syntax. For new projects, prefer fetch.
Read guide →reCAPTCHA vs hCaptcha, honeypots, AI spam classifiers.
reCAPTCHA vs hCaptcha — Which to Use in 2026
Both reCAPTCHA and hCaptcha solve the same problem: blocking bot submissions. reCAPTCHA is free with Google data harvesting. hCaptcha is paid (or free with ads) with stronger privacy. For most forms, neither is the right answer — use a honeypot instead.
Read guide →reCAPTCHA v3 Setup — Working Code and Score Thresholds
reCAPTCHA v3 runs invisibly and returns a score from 0.0 (bot) to 1.0 (human). Set up the script, attach a token to every submission, verify the token server-side, reject submissions below your threshold. Or skip all of this and use a honeypot — splitforms ships one free.
Read guide →Invisible reCAPTCHA — How It Works and When to Use It
'Invisible reCAPTCHA' usually refers to two things: reCAPTCHA v2's invisible variant (badge in the corner, fires only on submit) and reCAPTCHA v3 (always-on, no visible UI). Both run without a puzzle for most users — but harvest behavioral data and occasionally fall back to a puzzle for flagged users.
Read guide →Stop Form Spam Bots — Honeypot + Server-Side Filter Strategy
Two layers stop most form spam without CAPTCHA: a honeypot field (catches 40-60%) and server-side filtering — time-trap, rate limits, content heuristics — for the rest. Working code below; no third-party JS, no user friction, no privacy concerns.
Read guide →Every guide, one working endpoint.
Grab a free splitforms access key and wire any form on this site to a real backend — 500 submissions per month, spam-filtered to your inbox, no server.