---
title: "email-link-builder.samcarlton.com | Sam Carlton"
source: "https://samcarlton.com/portfolio/email-link-builder/"
---

# email-link-builder.samcarlton.com

June 2026

**You can pre-fill an email from a link.**

email-link-builder is the tool behind that idea: a `mailto:` link that pre-fills the subject and body, so the person clicking it doesn’t have to be techy at all — “it just opens your Gmail, and it’s actually ready to go.” Fill in recipients, CC, BCC, subject, and body, and it outputs both the final mailto link and a copy-ready HTML anchor.

## Links

-   **Site:** [email-link-builder.samcarlton.com](https://email-link-builder.samcarlton.com/)
-   **GitHub:** [ThatGuySam/email-link-builder](https://github.com/ThatGuySam/email-link-builder)

## Highlights

-   **Two outputs at once** — a `mailto:` link and a matching HTML anchor.
-   **Full address support** — recipients, CC, BCC, subject, and body.
-   **Variable mode** — optional `mailto.tools` variables for templated drafts.
-   **No backend** — everything runs client-side and persists locally.

## How It’s Built

-   **Frontend** — a static Vue app (extracted from a CodePen-style tool) with Bulma layout, SCSS, Animate.css, and Font Awesome.
-   **Build system** — Laravel Mix on Webpack, the HTML Webpack Plugin, PostHTML includes, and PurgeCSS.
-   **Client behavior** — `mailto:` URL construction, optional `mailto.tools` variables, local-storage persistence, email validation, and query-string parsing.
-   **Hosting** — a Netlify static publish directory with an SPA redirect, behind Cloudflare on the live subdomain.

## Screenshots

![email-link-builder.samcarlton.com desktop mailto builder with generated link](/project-screenshots/email-link-builder/email-link-builder-desktop.png)

Desktop builder with a generated `mailto:` link and HTML anchor preview.

![email-link-builder.samcarlton.com mobile mailto builder](/project-screenshots/email-link-builder/email-link-builder-mobile.png)

Mobile mailto builder form.