Free Online Contact Form for Any Website

An online contact form lets visitors send you a message directly from your website. Instead of publishing a raw email address (and inviting spam), a web contact form gives people a structured way to reach you, with fields for their name, email, and message, while keeping your inbox clean and organized.

Every website needs one. A contact form is the most reliable way for visitors to reach you, no matter what kind of site you run. In this guide, you'll learn how to create a contact form online using plain HTML and FormWit. No coding experience, no server setup, no monthly fees.

Why use an online contact form instead of a mailto link

A mailto: link opens the visitor's email client, if they have one configured. Many people don't, especially on work computers or mobile devices where the default mail app isn't set up. When that happens, the link does nothing. Even when it works, you lose control over formatting and can't enforce required fields.

An online contact form solves all of that:

Works for everyone - no email client needed, just a browser
Validates input - require fields, check email format before submission
Blocks spam - honeypot fields and automatic filtering stop bots
Tracks submissions - every message is stored in a searchable dashboard
Sends notifications - get an email the moment someone submits

A mailto link also exposes your email address in the page source. Spam bots scrape HTML for email addresses and add them to mailing lists. A contact form keeps your address private while still letting real people reach you.

Mobile considerations for contact forms

More than half of web traffic comes from mobile devices. A contact form that works great on desktop but breaks on a phone loses you messages. Here's what to get right:

Use correct input types

Mobile browsers show different keyboards depending on the type attribute. type="email" shows the @ symbol prominently. type="tel" shows a number pad. type="text" shows the default keyboard. Using the right type saves your visitors keystrokes.

<!-- Email keyboard with @ key -->
<input type="email" name="email" />

<!-- Number pad for phone -->
<input type="tel" name="phone" />

<!-- URL keyboard with / and .com -->
<input type="url" name="website" />

Set font size to 16px or larger

iOS Safari auto-zooms into form fields with a font-size smaller than 16px. The page zooms in when the user taps the input and stays zoomed until they pinch back out. Set font-size: 16px on your inputs to prevent this behavior:

input, textarea, select {
  font-size: 16px;
}

Make tap targets large enough

Google recommends touch targets of at least 48x48 pixels. Your submit button and input fields should have enough padding that a finger tap reliably hits the target. padding: 12px on inputs and buttons gets you there.

Test on real devices

Chrome DevTools device mode is useful for layout testing, but it doesn't simulate the keyboard behavior, auto-zoom, or touch events of real devices. Test your form on an actual phone before going live. Pay attention to whether the form fields are visible above the on-screen keyboard and whether the page scrolls correctly when focusing each field.

How to create an online contact form in 3 steps

Step 1: Sign up for FormWit

Create a free FormWit account. No credit card required. Click Create Form in your dashboard and copy the form endpoint URL.

Step 2: Add the HTML to your website

Paste this web contact form code anywhere on your site, in an HTML page, a CMS embed block, or a static site template:

<form action="https://app.formwit.com/api/s/YOUR_FORM_ID" method="POST">
  <label for="name">Name</label>
  <input type="text" id="name" name="name" required />

  <label for="email">Email</label>
  <input type="email" id="email" name="email" required />

  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <!-- Honeypot - invisible spam trap -->
  <input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off" />

  <button type="submit">Send Message</button>
</form>

Replace YOUR_FORM_ID with the endpoint ID from your dashboard. That's the only change you need to make.

Step 3: Publish and test

Deploy your site (or save the page in your CMS) and submit a test message. You'll see it appear in your FormWit dashboard and receive an email notification within seconds.

Spam prevention without CAPTCHAs

CAPTCHAs work, but they annoy visitors. Google's reCAPTCHA tracks users across the web. hCaptcha makes people identify buses and crosswalks. Both add friction that reduces form completion rates.

FormWit uses a different approach: a combination of honeypot fields and server-side rate limiting that catches bots without bothering humans.

How the honeypot works

Add a hidden input field to your form:

<input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off" />

Real visitors never see or interact with this field. Bots, however, parse the HTML and auto-fill every input they find. When a submission arrives with the _gotcha field filled in, FormWit knows it came from a bot and silently rejects it. No error page, no indication to the bot that it was caught.

Rate limiting

FormWit also limits how many submissions a single IP address can send within a time window. A human might submit your contact form once. A bot script blasting your endpoint hundreds of times per minute gets throttled after the first few requests. Combined with the honeypot, this blocks the vast majority of automated spam.

When to add a CAPTCHA

For most sites, the honeypot + rate limiting combination handles spam effectively. If you run a high-traffic site and still see spam getting through, consider adding a CAPTCHA as a third layer. See the spam protection guide for CAPTCHA integration options.

Form field best practices

The fields you include and how you configure them affect both the quality of submissions you receive and the likelihood that visitors complete the form.

Keep it short

Every additional field reduces completion rate. For a basic contact form, three fields are enough: name, email, message. If you need more information, ask for it in your follow-up reply, not in the form.

Mark optional fields, not required ones

If most fields are required, marking the optional ones is less visual noise than marking every required field with an asterisk. Add "(optional)" after the label text for fields that aren't mandatory.

Use placeholder text sparingly

Placeholder text disappears when the user starts typing. If you put instructions in the placeholder, the user can't reference them while filling in the field. Use labels for field names and helper text below the input for instructions. Reserve placeholders for showing format examples only, like "name@example.com" in an email field.

Use the right input types

Use type="email" for email fields and type="tel" for phone numbers. These trigger the correct mobile keyboard and enable built-in browser validation. Using type="text" for everything works but gives your visitors a worse experience.

Add a subject field only if you need it

Many contact forms include a subject field out of habit. If all messages go to the same inbox and you don't route based on subject, drop it. One less field means one less thing between your visitor and the "Send" button.

Customizing your contact form

The HTML above is a starting point. You can add any fields you need: phone number, company name, subject, dropdown menus. Every field with a name attribute gets captured and included in the notification email.

Here's an example with a subject dropdown:

<label for="subject">Subject</label>
<select id="subject" name="subject" required>
  <option value="">Select a topic</option>
  <option value="General inquiry">General inquiry</option>
  <option value="Support">Support</option>
  <option value="Sales">Sales</option>
</select>

Style the form with your own CSS or use a framework like Tailwind. See the Tailwind contact form guide for a ready-made styled example.

What you get with FormWit

Here's what FormWit gives you out of the box:

Email notifications - every submission is forwarded to your inbox instantly, with all fields neatly formatted
Submission dashboard - view, search, and export all submissions from a clean web interface
Spam protection - built-in filtering catches known bot patterns automatically. Add a honeypot field for extra protection
Custom redirects - send visitors to your own thank-you page after they submit
AJAX support - submit forms without a page reload using the Fetch API for a smoother user experience
Platform-agnostic - if your site can render an HTML form tag, FormWit works. Static sites, WordPress, Webflow, Carrd, Squarespace all tested

Free vs paid plans

FormWit's free plan includes everything you need to get started:

Feature	Free	Pro
Forms	Unlimited	Unlimited
Submissions / month	100	5,000
Email notifications	Yes	Yes
Dashboard	Yes	Yes
Spam protection	Yes	Yes
Custom redirect	Yes	Yes
AJAX / fetch support	Yes	Yes
File uploads	No	Yes
Webhooks	No	Yes
Priority support	No	Yes

The free plan is enough for personal sites, portfolios, and small businesses. Upgrade when you need higher volume, file uploads, or webhook integrations. Get started free.

Frequently asked questions

Is a contact form better than a mailto link?

Yes. A mailto link requires the visitor to have a configured email client, exposes your email address to spam scrapers, and gives you no control over required fields or data format. A contact form works in any browser, validates input before submission, blocks spam, and stores messages in a searchable dashboard.

What fields should my form have?

Start with three: name, email, and message. Every additional field reduces completion rate. If you need more information (phone number, company, budget), ask in your follow-up reply instead of adding more required fields to the form.

How do I prevent spam?

Add a honeypot field -- a hidden input that bots fill in but humans never see. FormWit automatically rejects submissions where the honeypot has a value. Combined with server-side rate limiting (also built into FormWit), this blocks the vast majority of spam without requiring CAPTCHAs.