Mailto and Tel Links

HTML supports special URL schemes in the href attribute. The mailto: scheme opens the user's default email client with a new message pre-addressed to the given address. The tel: scheme enables click-to-call on mobile devices and VoIP-enabled desktops.

Advanced Mailto Parameters

You can pre-fill the subject, CC, BCC, and body of an email by appending query parameters to a mailto: link. Spaces and special characters must be URL-encoded (e.g., space becomes %20). Use these sparingly — overly pre-filled emails can feel impersonal.

mailto:user@example.com — Basic email link
mailto:a@b.com?subject=Hello — With subject
tel:+15551234567 — Phone link (international format)

Example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Mailto and Tel Links</title>
</head>
<body>
  <h1>Contact Us</h1>

  <!-- Basic email link -->
  <p>Email: <a href="mailto:info@example.com">info@example.com</a></p>

  <!-- Pre-filled subject and body -->
  <p>
    <a href="mailto:support@example.com?subject=Help%20Request&body=Hello%2C%20I%20need%20help%20with...">
      Contact Support
    </a>
  </p>

  <!-- Phone link -->
  <p>Call us: <a href="tel:+15559876543">+1 (555) 987-6543</a></p>

  <!-- Multiple recipients -->
  <p>
    <a href="mailto:a@example.com,b@example.com">Email Team</a>
  </p>
</body>
</html>

HTML

Full Editor

Pro Tip

Always display the email address or phone number as the visible link text alongside the mailto: or tel: link — users should be able to copy the address manually if their device does not support the scheme.

Related Resources

HTML Reference

Complete tag & property list

HTML How-To Guides

Step-by-step practical guides

HTML Exercises

Practice what you've learned