You've built a beautiful static site. No server. No database. No monthly hosting bills. Life is good. Then your client asks: "Can we add a contact form?"

And just like that, your zero-server dream crumbles. Or does it?

There are several free services that accept form submissions via simple HTML forms — no backend code required. Here's a complete guide to the best options.

Option 1: Formspree (The Old Faithful)

Formspree has been doing this since 2014 and it just works. You point your form's action at their endpoint:

<form action="https://formspree.io/f/YOUR_FORM_ID" method="POST">
  <input type="text" name="name" placeholder="Your name" required>
  <input type="email" name="email" placeholder="Your email" required>
  <textarea name="message" placeholder="Your message" required></textarea>
  <button type="submit">Send</button>
</form>

Free tier: 50 submissions/month. For a personal portfolio or small business, that's plenty. Submissions land in your email inbox. Done.

Option 2: Web3Forms (No Registration Required)

Web3Forms is even simpler. You get an access key, drop it in a hidden input, and you're done:

<form action="https://api.web3forms.com/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
  <input type="text" name="name" required>
  <input type="email" name="email" required>
  <textarea name="message" required></textarea>
  <button type="submit">Send</button>
</form>

Free forever. Unlimited submissions. No account required — just enter your email on their site to get a key. Has built-in spam protection too.

Option 3: Netlify Forms (If You Host on Netlify)

If your static site is on Netlify, they have magic form detection. Just add netlify to your form tag:

<form name="contact" netlify>
  <input type="text" name="name" required>
  <input type="email" name="email" required>
  <textarea name="message" required></textarea>
  <button type="submit">Send</button>
</form>

Netlify detects the form at deploy time, sets up the backend automatically, and you see submissions in your Netlify dashboard. Free tier: 100 submissions/month.

Adding Spam Protection

Bots love unprotected forms. Here's a simple honeypot technique that catches most spam — no CAPTCHAs needed:

<!-- Hidden field that humans won't fill but bots will -->
<input type="text" name="_gotcha" style="display:none">

Both Formspree and Web3Forms support this pattern. If the hidden field has a value, the submission is silently ignored.

Making It Look Good

The default HTML form looks like it's from 1997. Here's minimal CSS that makes it presentable:

form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 500px;
}

input, textarea {
  padding: 0.8rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-family: inherit;
  font-size: 1rem;
}

input:focus, textarea:focus {
  outline: none;
  border-color: #d97706;
  box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.15);
}

button {
  padding: 0.8rem 2rem;
  background: #d97706;
  color: white;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
}

Custom Thank-You Page

By default, these services redirect to their own "thanks" page. Override that by adding a redirect field:

<!-- For Formspree -->
<input type="hidden" name="_next" value="https://yoursite.com/thanks.html">

<!-- For Web3Forms -->
<input type="hidden" name="redirect" value="https://yoursite.com/thanks.html">

Which One Should You Use?

  • Web3Forms if you want free + unlimited + no account
  • Formspree if you want a dashboard and email integrations
  • Netlify Forms if you're already on Netlify (zero extra setup)

None of these require you to write server code. None charge you for basic usage. The "I need a backend for forms" excuse for adding server infrastructure is officially dead.