Send email from your website's contact form

An HTML form only sends its data somewhere. Browsers can't send email themselves, and a mailto: link just opens the visitor's own mail app, which many people don't have set up. To get a real email you need a service that receives the form and sends it through an SMTP account. Neuctra Mailer is that service, so you don't have to write or host a backend.

1. 1Create a free Neuctra Mailer account and add a service.
2. 2Connect the email account that should send the messages, for example Gmail with an App Password. Check these settings confirms the login works.
3. 3Under Settings, add your website to Allowed websites and your own address to Allowed recipients, so the key can only email you.
4. 4Add the form code below to your page, with the four values from the Overview tab.

No build tools or npm needed. This works on any static site, including pages on Netlify, GitHub Pages or a simple web host.

<form id="contact">
  <input name="name" placeholder="Your name" required />
  <input name="email" type="email" placeholder="Your email" required />
  <textarea name="message" placeholder="Message" required></textarea>
  <button>Send</button>
</form>

<script>
  // The four values are on your service's Overview tab in Neuctra Mailer.
  const MAILER_URL = "https://your-server-url";
  document.getElementById("contact").addEventListener("submit", async (event) => {
    event.preventDefault();
    const form = new FormData(event.target);
    const response = await fetch(MAILER_URL + "/api/mail/send", {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "x-api-key": "nm_your_public_key",
        "x-service-id": "your-service-id",
        "x-service-name": "your-service-name",
      },
      body: JSON.stringify({
        to: "[email protected]",
        replyTo: form.get("email"),
        subject: "New message from " + form.get("name"),
        text: form.get("message"),
      }),
    });
    alert(response.ok ? "Thanks! Your message was sent." : "Sorry, it didn't send. Please try again.");
  });
</script>

Install the SDK with npm install @neuctra/mailer and send from your submit handler.

import { NeuctraMailer } from "@neuctra/mailer";

const mailer = new NeuctraMailer({
  serverUrl: process.env.NEXT_PUBLIC_MAILER_URL,
  serviceId: process.env.NEXT_PUBLIC_MAILER_SERVICE_ID,
  serviceName: process.env.NEXT_PUBLIC_MAILER_SERVICE_NAME,
  apiKey: process.env.NEXT_PUBLIC_MAILER_API_KEY,
});

await mailer.send({
  to: "[email protected]",
  replyTo: form.email,
  subject: `New message from ${form.name}`,
  text: form.message,
});

• Allowed websites: requests from any other site are refused
• Allowed recipients: a copied key can only email your own inbox
• Optional Cloudflare Turnstile captcha on every submission
• Rate limits per minute and per day (30 and 500 by default)
• Replace the key in one click if it ever leaks