How to Build a mailto: Link with a Prefilled Subject and Body
A practical guide to mailto links — encode subject, body, cc and bcc correctly, embed clickable contact links on your site, and know where mailto stops.
How to Build a mailto: Link with a Prefilled Subject and Body
A mailto: link is the oldest trick on the web for making an email address clickable, and it still works in every browser and mail client made this decade. Click one and your default mail program opens a new message, already addressed, sometimes with the subject and first paragraph typed for you. No form, no backend, no signup. The catch is that the link is a URL, and URLs have rules. Put a raw space or an ampersand in the wrong place and the subject gets chopped off or the second recipient quietly vanishes. This guide walks through building one correctly, from a bare address to a fully prefilled draft you can drop behind a button.
What a mailto Link Actually Is
The simplest form is just the scheme and an address:
mailto:sales@acme.com
Clicking that opens a blank message to sales@acme.com. Everything else is optional and lives in a query string after a ?, exactly like the query string on a normal web page URL. The fields a mail client understands are subject, body, cc, and bcc. You chain them with &, the same separator a web form uses:
mailto:sales@acme.com?subject=Pricing&cc=team@acme.com&body=Hi
That opens a message to sales, carbon-copies the team, sets the subject to "Pricing", and drops "Hi" into the body. The order of the parameters does not matter to the client; subject first or body first reads the same.
Encoding the Parameters So Nothing Breaks
Here is the part people get wrong by hand. A URL cannot contain a literal space, a literal newline, or several punctuation marks that already mean something inside a query string. Those characters have to be percent-encoded — replaced with a % followed by a hex byte value. The two you will hit constantly:
- A space becomes
%20. - A line break (newline) becomes
%0A.
So a subject of "Demo request" is not subject=Demo request; it is subject=Demo%20request. And a two-line body of "Hi there\nThanks" becomes body=Hi%20there%0AThanks. The ampersand, equals sign, and question mark also need escaping inside a value (%26, %3D, %3F), because otherwise the client reads an & in your sentence as the start of a new parameter and truncates your text. This is precisely the same percent-encoding scheme used everywhere else on the web; if you want to see what any string turns into, run it through a URL encoder and watch each character map to its escape.
The RFC that governs these links (RFC 6068) spells out the encoding, but you do not want to do it in your head. Type plain text into the mailto link generator and it produces the encoded URL, escaping spaces, newlines, and reserved characters so the link survives a copy-paste into HTML, a chat box, or a QR code.
A Worked Example
Say you run support for a small app and want a "Report a bug" link that arrives in a predictable shape. You want the subject set to "Bug report", and the body pre-seeded with a tiny template so people fill in the same three things every time. In plain text the body is:
Steps to reproduce:
Expected:
Actual:
Encoded into a single mailto link, that becomes:
mailto:support@yourco.com?subject=Bug%20report&body=Steps%20to%20reproduce%3A%0A%0AExpected%3A%0A%0AActual%3A
Read it left to right: the address is support@yourco.com, the subject is "Bug report" (the space is %20), and the body is the template with every space as %20, every colon as %3A, and every blank line as a doubled %0A%0A. Paste that URL into a browser address bar and hit enter — your mail client opens a draft to support, titled "Bug report", with the template already laid out. Nobody sends a blank email titled "help" again, and triage stops asking for the basics.
Embedding the Link on a Website
Once you have the URL, putting it on a page is one anchor tag:
<a href="mailto:support@yourco.com?subject=Bug%20report">Report a bug</a>
Two small things bite people here. First, inside an HTML attribute the & that joins parameters should be written as the entity &, not a bare &. A lenient browser forgives the bare version, but a strict HTML validator (or an email template engine) may misread it. So a two-parameter link in markup looks like ?subject=Hi&body=Hello. Second, multiple recipients are separated with commas, not semicolons:
mailto:alice@x.com,bob@y.com
The semicolon is an Outlook habit; the mailto spec uses commas, and many clients silently drop the second address if you use a semicolon. The same comma rule applies inside the cc and bcc fields. If you would rather not hand-write the anchor, the generator gives you a ready-to-paste HTML version with the ampersand already written as &, so the markup validates the first time.
A Note From My Own Inbox
I added a prefilled mailto link to the footer of a side project last year, mostly to stop copy-pasting my address into a CMS. The surprise was not the convenience — it was the reply quality. Before, the handful of emails I got were one-liners with no context. After I set the body to a three-field template (what you were doing, what broke, your browser), almost every message arrived with those three things filled in. People follow the shape you give them. It cost me five minutes to build the link and saved a round-trip on nearly every bug report. The encoding was the only fiddly part, and that is exactly the step worth letting a tool handle.
Where mailto Stops
Be honest about the limits, because they are real. A mailto link only works if the visitor has a desktop mail client configured, or a mobile mail app set as default. A reader who lives entirely in webmail through a browser may see nothing happen, or a "choose an application" prompt. You cannot attach files through a mailto link, you cannot guarantee HTML formatting in the body (it is plain text by spec), and very long bodies can hit URL-length limits in some clients — keep prefilled bodies to a short template, not an essay.
It is also worth knowing that mailto exposes the raw email address in the page source, which spam crawlers harvest. And anything you put in a shared link's query string travels in plain sight: paste a share link into a chat and the receiving server's access log records the subject and body you typed. For a contact link on your own page that is harmless, but it is not the channel for a confidential draft.
For most contact and feedback cases, none of that matters and the one-click open is worth it. When you want the link to do more — drive a phone scan, or sit on a contact card — feed the same encoded URL into a QR code generator and let people scan straight into a half-written email instead of typing your address on a phone keyboard. Build the link once, encode it correctly, and it keeps working long after the form you might have built instead has rotted.
Made by Toolora · Updated 2026-06-13