How to Create a Mailto Link in HTML

A mailto link turns a plain email address on your website into a clickable link that opens the visitor’s email app with everything ready to go. Instead of asking people to copy your address, you let them click once and start writing. Creating a mailto link in HTML is simple, and you can even pre-fill the subject and message.

This guide explains the syntax, how to add a subject and body, and the small details that make a mailto link work reliably.

What Is a Mailto Link?

A mailto link is a standard web link that uses the mailto: scheme instead of http. When someone clicks it, their device opens its default email program with a new message addressed to you. It is the normal way to add a contact email to a web page, a footer, or an email signature.

Because it relies on the visitor’s own email app, a mailto link works everywhere without any server-side code. It is pure HTML.

The Basic Mailto Link Syntax

At its simplest, a mailto link looks just like a normal link, but the href starts with mailto: followed by the address:

• The link text is whatever you want people to see, such as “Email us” or the address itself.
• The href value is mailto: plus the email address.

So a basic mailto link points its href to mailto:hello@example.com, and the clickable text can read “Email us.” That is all you need for a working email link.

Adding a Subject and Message

The real power of a mailto link is pre-filling the email. You can add a subject line and a message body so the visitor’s email opens partly written. This is done by adding parameters after the address, starting with a question mark.

• Subject is added with ?subject= followed by your text.
• Body is added with &body= followed by your message.

The one rule to remember is that spaces and special characters must be encoded. A space becomes %20 and a line break becomes %0A. If you do not encode them, some email apps will cut off the subject or body. This is exactly the kind of fiddly detail that is easy to get wrong by hand.

Adding CC, BCC, and Multiple Recipients

You can also pre-fill carbon copy and blind carbon copy recipients:

• CC uses &cc= followed by the address.
• BCC uses &bcc= followed by the address.
• Multiple recipients are separated by commas in any of the fields.

So a single link can address your support inbox, copy a manager, and add a subject line, all before the visitor types a word.

The Easy Way: Use a Generator

Writing mailto links by hand works for a simple address, but as soon as you add a subject, a multi-line message, or CC and BCC, the encoding gets tricky. A misplaced space or an un-encoded character can break the link.

The reliable approach is to use a mailto link generator. You fill in the address, subject, message, and any CC or BCC, and it builds a correctly encoded link plus the ready-made HTML code. You copy it straight into your page with no guesswork. You can even test the link before you use it.

Best Practices for Mailto Links

A few habits keep your email links working well:

• Always encode the subject and body, or use a generator that does it for you.
• Keep pre-filled messages short. Long bodies can hit limits in some email apps.
• Offer a fallback. Some visitors use webmail that does not open from a mailto link, so showing the address as text too is helpful.
• Do not rely on it for spam protection. A plain mailto link can be harvested by bots, so consider a contact form for high-traffic pages.

Frequently Asked Questions

How do I create a clickable email link in HTML?

Use an anchor tag with the href set to mailto: followed by the address. The link text can be anything, such as “Email us.”

How do I add a subject to a mailto link?

Add ?subject= followed by your encoded subject text after the address. Spaces should be written as %20.

Can a mailto link have more than one recipient?

Yes. Separate multiple addresses with commas in the To, CC, or BCC fields and the email will include all of them.

Why is my mailto subject getting cut off?

It usually means spaces or special characters were not encoded. A generator handles the encoding automatically so the full subject appears.

Build Your Mailto Link Now

A mailto link is the friendliest way to invite contact on your site. To create one with the subject and message pre-filled and the encoding handled for you, open the mailto link generator and copy the result. For more utilities like this, see our guide to the best free online tools for developers.