Updated March 2026
Your static site has no backend. No Express, no Django, no server at all. Just HTML, CSS, and maybe some JavaScript. Deployed on Netlify, Vercel, Cloudflare Pages, or GitHub Pages.
Sutrena is the backend. Your static HTML form POSTs directly to Sutrena's submit endpoint. No server on your end.
Two approaches:
Embed: Add two lines of HTML. The form renders inside your page with default styling. Works but you do not control the design.
Custom form: Write your own HTML form. On submit, fetch POST to /api/forms/{id}/submit with JSON body. Full design control. This is what most people do for production.
The submit endpoint is public — no API key needed. By design, because submissions come from visitors' browsers. The API key is only for management operations (creating forms, reading submissions).
Sutrena handles validation, storage, dedup, and webhooks. Your static site just sends the data.
Works with Hugo, Jekyll, Astro, 11ty, plain HTML. Anything that outputs HTML.
<!-- Option 1: Embed (2 lines) -->
<div data-sutrena-form="FORM_ID"></div>
<script src="https://sutrena.com/embed.js"></script>
<!-- Option 2: Custom form (full control) -->
<form id="contact">
<input name="email" type="email" required />
<textarea name="message" required></textarea>
<button type="submit">Send</button>
</form>
<script>
document.getElementById("contact").addEventListener("submit", async (e) => {
e.preventDefault();
const data = Object.fromEntries(new FormData(e.target));
const res = await fetch("https://sutrena.com/api/forms/FORM_ID/submit", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(data),
});
if (res.ok) e.target.innerHTML = "<p>Sent. Thanks.</p>";
});
</script>