Plain HTML guide
The original, bulletproof pattern: a single HTML form that POSTs to FormLoom. No framework, no build step, no JavaScript. It works in an email-able `.html` file, a CMS block, or any page you can paste markup into.
Approach
Paste a `<form action method="POST">` with your fields. Add a hidden `redirect` field for the thank-you page, or the small AJAX script for an inline success state.
Code
contact.html
<form action="https://formloom.vercel.app/api/submit/YOUR_ACCESS_KEY" method="POST">
<label>
Name
<input type="text" name="name" required />
</label>
<label>
Email
<input type="email" name="email" required />
</label>
<label>
Message
<textarea name="message" required placeholder="How can we help?"></textarea>
</label>
<!-- honeypot: bots fill this, humans don't see it -->
<input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off" />
<button type="submit">Send</button>
</form>contact.html
<form id="contact-form">
<label>
Name
<input type="text" name="name" required />
</label>
<label>
Email
<input type="email" name="email" required />
</label>
<label>
Message
<textarea name="message" required placeholder="How can we help?"></textarea>
</label>
<!-- honeypot: bots fill this, humans don't see it -->
<input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off" />
<button type="submit">Send</button>
</form>
<script>
const form = document.getElementById("contact-form");
form.addEventListener("submit", async (e) => {
e.preventDefault();
const res = await fetch("https://formloom.vercel.app/api/submit/YOUR_ACCESS_KEY", {
method: "POST",
headers: { "Content-Type": "application/json", Accept: "application/json" },
body: JSON.stringify(Object.fromEntries(new FormData(form))),
});
const data = await res.json();
if (data.success) {
form.reset();
alert("Thanks — we got your message.");
} else {
alert(data.message || "Something went wrong.");
}
});
</script>submit.ts
// npm i @formloom/client
import { createForm } from "@formloom/client";
type Contact = {
name: string;
email: string;
message: string;
};
const form = createForm<Contact>("YOUR_ACCESS_KEY");
// End-to-end typed: TS errors if you send the wrong shape.
const { success, message } = await form.submit({
name: form.name.value,
email: form.email.value,
message: form.message.value,
});Gotchas
- Use a hidden `redirect` field if you want a thank-you page without JavaScript.
- Add the honeypot `botcheck` field (hidden) to block low-effort bots.
- For AJAX, set `Accept: application/json` so FormLoom returns JSON instead of redirecting.
FAQ
No. The plain `<form method="POST">` works with zero JS. Add a tiny script only if you want an inline success message.
See the full Plain HTML contact form page with a live demo.