Contact form with auto-reply
The markup does not change at all. The auto-reply is a template you write once in your form settings, and it goes out to whoever submitted the form seconds after they press send — so nobody is left wondering whether the message went anywhere.
Replace YOUR_FORM_ID with a form of your own and this sends to your inbox.
<form action="https://submit.formpost.ai/YOUR_FORM_ID" method="POST">
<h2>Contact us</h2>
<p class="lede">You will get a confirmation straight away.</p>
<label for="name">Name</label>
<input id="name" type="text" name="name" required>
<label for="email">Email</label>
<input id="email" type="email" name="email" required>
<p class="hint">Your acknowledgement goes here, so check it for typos.</p>
<label for="message">Message</label>
<textarea id="message" name="message" rows="3" required></textarea>
<button type="submit">Send message</button>
</form>Subject: We got your message, {{name}}
Hi {{name}},
Thanks for getting in touch. Your message is in front of a
human and we reply to everything within one working day.
Here is what you sent us, for your records:
{{message}}
If it turns out to be urgent, call us on +1 (555) 010-0
rather than replying to this — it is a much faster route.
— The team at Examplebody {
margin: 0;
padding: 32px 16px;
background: #fafafa;
font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
color: #171717;
}
form {
display: flex;
flex-direction: column;
max-width: 430px;
margin: 0 auto;
padding: 28px;
background: #fff;
border: 1px solid #ededed;
border-radius: 14px;
}
h2 {
margin: 0 0 4px;
font-size: 20px;
}
.lede {
margin: 0 0 20px;
font-size: 14px;
color: #737373;
}
label {
margin-bottom: 6px;
font-size: 13px;
font-weight: 600;
color: #404040;
}
input,
textarea {
box-sizing: border-box;
font: inherit;
margin-bottom: 16px;
padding: 10px 12px;
color: #171717;
background: #fff;
border: 1px solid #d4d4d4;
border-radius: 8px;
}
input:focus,
textarea:focus {
border-color: #171717;
outline: 2px solid rgba(23, 23, 23, 0.12);
}
textarea {
resize: vertical;
}
button {
padding: 11px 16px;
font: inherit;
font-weight: 600;
color: #fff;
background: #171717;
border: 0;
border-radius: 8px;
cursor: pointer;
}
.hint {
margin: -8px 0 16px;
font-size: 12px;
color: #a3a3a3;
}How the recipient is chosen
The replyto field wins if you send one. Otherwise the first field that looks like an email address is used — email, e-mail, your-email and similar all work. If nothing usable is found the acknowledgement is skipped and your own notification still goes out, so a form without an email field is not an error, it just has nobody to reply to.
This is the practical reason to name the field email rather than something inventive. It is also why the form above puts a note under the field: a typo there means the acknowledgement bounces and the sender concludes nothing arrived.
Write a receipt, not a newsletter
- Confirm what you received. Quoting their message back with {{message}} is the single most reassuring thing you can do.
- Say when a human will reply, and mean it. Within one working day is a promise; as soon as possible is noise.
- Give an escape hatch for anything urgent — a phone number or a different address beats a second email into the same queue.
- Keep it plain. An acknowledgement wrapped in a marketing template reads as automated in the bad sense, and is more likely to be filtered.
- Do not ask them to reply to it. Auto-replies that invite a response start loops.
Any field can go in the template
Double-brace placeholders pull in whatever the form submitted, so a topic dropdown or a reference number can appear in the acknowledgement. A placeholder with no matching field renders empty rather than printing the raw braces at somebody.
Spam never triggers a reply
Submissions caught by the spam filter do not get an acknowledgement. That is deliberate: an autoresponder that answers everything is a way for a bot to send mail out of your account to a forged address, which is how a domain's reputation gets ruined by a form nobody was watching.
Questions about this contact form
- How do I send an automatic reply from a contact form?
- Write the reply once in your form settings and switch the autoresponder on. Nothing changes in your HTML — the acknowledgement goes to whoever filled the form in, seconds after they submit.
- Which address does the auto-reply go to?
- The replyto field if you send one, otherwise the first field that looks like an email address. If no address can be found the reply is skipped and your own notification still arrives.
- Can I include what the visitor wrote?
- Yes — use double-brace placeholders like {{message}} and {{name}}. Any submitted field can go in the template, and a placeholder with no matching field simply renders empty.
- Do spam submissions get an auto-reply?
- No, and that is deliberate. Replying to everything would let a bot send mail out of your account to a forged address, which is a fast way to damage your sending reputation.
Related examples
Contact us page
The whole page: address, phone and hours beside the form, in two columns.
Contact form with captcha
Turnstile, hCaptcha or reCAPTCHA — plus the honeypot that does most of the work.
Simple contact form
Three fields, a button, and about forty lines of CSS. The one to start from.
Or go back to all 21 contact form examples.
Give this form an endpoint
Formpost takes the submission, emails it to you and keeps a searchable copy. Free for 250 messages a month, with unlimited forms and no card.