Free tool

Contact form generator

Build a working contact form for any static site in seconds. Choose your fields, style it, and copy the code for HTML or your framework. Spam protection and email notifications included.

Fields

Submission

Where submissions go. Paste your form ID to make the code real — or keep the placeholder while you experiment.

On submit

Spam & privacy

Design

Styling

Adds Tailwind utility classes. Your project needs Tailwind installed.

Live preview

What belongs on a contact form

A contact form exists so a stranger can reach you without you publishing an address. That one fact makes spam its defining problem rather than an afterthought, and it is why the shortest version of this form usually outperforms the thorough one.

Email
The only field you genuinely need. Everything else is a convenience you are charging the visitor for.
Name
Earns its place because it lets you open the reply properly. It does not need to be required.
Message
One open box beats five specific ones on a first contact. You do not yet know what they want to tell you.
Phone — usually a mistake
The most common reason a contact form is abandoned: it reads as a sales call. If you need it, make it optional and say why.

The mistake to avoid: A dropdown that forces a category too early

“What is this regarding?” with five options assumes the visitor knows how you are organised. People pick the wrong one, or leave. Route on the content of the message instead, and keep the form a single box.

Reply-to is set from the submitter's address automatically, so you can answer from your own inbox and the thread lands back with them. Point notifications at a shared alias rather than one person if more than one of you answers.

How it works

  1. Choose a template and fields. Pick a template, then add, remove, or reorder fields and mark the required ones. Add step breaks to turn a long form into a multi-step form.
  2. Style it. Pick CSS, Tailwind, or unstyled output and tune the theme: accent color, light or dark, rounded corners.
  3. Copy your framework's code. Switch to HTML, React, Vue, Svelte, Astro, or a fetch() version and copy, download, or open it in CodePen.
  4. Connect an endpoint. Create a free ShipMyForm form to get a real endpoint, then drop your form ID in so submissions actually arrive.

Want the background? Read what a form backend is and how to stop form spam without reCAPTCHA. Want the submissions in your inbox? See how to send an HTML form to email. Already have a Google Form? Convert it to HTML. Got a form that submits but delivers nothing? Check its HTML.

Frequently asked questions

How few fields can a contact form have?
One. An email address is enough to reply, and a form with a single field converts better than any other version of it. Name and message are worth adding because they make the reply easier to write, not because the form needs them. Anything beyond those three should have to justify itself.
Should a contact form ask for a phone number?
Only if someone will actually call, and only as an optional field. A required phone number is one of the most common reasons a contact form is abandoned, because it reads as a commitment to a sales call rather than a way to get an answer.
How do I stop contact form spam without a CAPTCHA?
The generator adds a hidden honeypot field that bots fill and humans never see, which removes most automated traffic at no cost to real visitors. Combined with server-side rate limiting and content scoring that handles almost everything; keep a visible challenge in reserve for a form that is genuinely under attack.
Where do contact form submissions go?
To whatever endpoint you set as the form's action. Paste a ShipMyForm form ID and they are stored, spam-filtered and emailed to you, with the reply-to set to the sender so you can answer from your own inbox. Without an endpoint the form is markup and the submit button does nothing.