Framer contact form that sends to your email

Add the form to Framer

Add an Embed element to the page, choose HTML, and paste the form. For a reusable version, create a code component that renders the same markup. Publish, then submit a test message from the live site.

Embed (HTML)

<!-- Paste into a Framer Embed element -->
<form action="https://submit.heartdove.com/v1/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY" />
  <label>Email <input type="email" name="email" required /></label>
  <label>Message <textarea name="message" required></textarea></label>
  <!-- Hidden spam trap: people never see it, bots tick it -->
  <input type="checkbox" name="botcheck" tabindex="-1" autocomplete="off" style="display:none" />
  <button type="submit">Send message</button>
</form>

Framer serves the published site from your framer.app address and from any custom domain you connect. Register each address you publish to, because Heartdove checks the page origin exactly.

If Framer renders the embed inside a frame, the browser reports the frame origin rather than the page origin. Submit one test message, open the delivery timeline in your Heartdove inbox, and register the origin shown there if it differs.

Register your website address

Heartdove accepts a submission only from the exact website addresses registered on the form, so a copied key cannot be fired from somewhere else. Register every address the form is published on; each form takes up to 10, and registering a www address covers the bare domain too. For a Framer site that usually means:

https://your-site.framer.app
https://www.yourdomain.com

Testing locally? Register your local address, such as http://localhost:3000, as well.

What happens after submit

The message is saved to your inbox before any email is sent, so a failed alert never loses the enquiry. The alert is then tracked step by step and shown on the message:

CapturedSaved and searchable
Accepted by providerHanded to the email provider
DeliveredThe recipient’s mail server accepted it
BouncedShown with the reason; the address is paused

Over your monthly allowance, submissions are held, visibly, and released automatically. Nothing is billed as overage, and each plan’s hold capacity is on the pricing page. The Free plan includes 500 submissions a month with an instant alert for each.

Spam, without a CAPTCHA

Every form gets the exact origin check, a per-visitor rate limit, the hidden trap field and spam scoring with quarantine. Cloudflare Turnstile can be turned on per form for a human check, and is never required. Read how the layers work.

Questions

Why does my Framer form never email me?

Framer renders the form but does not send it anywhere. A plain HTML form needs a service to receive the post. Heartdove receives it, stores it and sends the alert, and shows you on each message whether that alert was delivered or bounced.

Is it safe to put the access key in my page?

Yes. The key is public and only identifies the form; it does not grant access to anything. Submissions are accepted only from the website addresses you register, each visitor is rate limited, and every message is scored for spam before it is stored.

Do I need a CAPTCHA?

No. Every form gets an exact origin check, a per-visitor rate limit, a hidden trap field and spam scoring with quarantine. Cloudflare Turnstile is optional for forms that want a human check.

Can I send visitors to my own thank-you page?

Yes. Add a hidden _redirect field with a full URL on one of the websites registered for the form. JSON requests get a receipt instead of a redirect.