How to send a HTML email with Gmail: easy step by step tutorial

Do you always need an email marketing platform like Mailchimp or Active Campaign to send a HTML designed email? You can actually use Gmail to send them as well. Emails sent directly from Gmail are much more likely to reach primary inboxes than ones sent from an email marketing platform.

You can't just copy and paste your email design into Gmail though. Even though it looks fine in the draft window, its formatting might get messed up after you send it. Here's how to send a HTML email with Gmail properly, step by step.

This method works in Google Chrome, Firefox and Internet Explorer.

~~Step 1: Copy the HTML code of the email you want to send with Gmail~~

You can send the HTML email to yourself with Litmus PutsMail first and view it on a few different email clients (desktop, mobile, app) to make sure the design looks as expected. Copy the HTML code of the email you want to send

~~Step 2: In Gmail, click '+ Compose' to compose a new email and type 'Text' in the body~~

~~Step 3: Highlight 'Text', right click and click on 'Inspect' in the dropdown menu~~

Right click and click on 'Inspect' to open the Inspect console

~~Step 4: In the Inspect console that pops up, right click on the highlighted blue section and click on 'Edit as HTML' in the dropdown menu~~

Right click on the highlighted section and click on 'Edit as HTML

~~Step 5: In the textarea that appears, highlight 'Text'~~

~~Step 6: Paste your email HTML code to replace 'Text'~~

~~Step 7: Click anywhere outside of the textarea to apply your HTML code~~

~~Step 8: Click 'x' at the top right corner to close the Inspect console. Now you'll see your HTML email in the compose window~~

~~Step 9: If needed, you can directly edit any of the text in the email. Add your subject line and recipient email address and it's ready to send!~~

~~Step 10: Here's how a HTML email would look for the recipient. It looks the same as if you sent it from an email marketing platform.~~

How your HTML email looks after sending it

You can use a browser extension like Streak to know if your contact opened your email or not. You can also use a tool like Gmass to send your HTML designed email to a list of contacts with names and other details personalized for each recipient.

Last updated: August 10th, 2020

"How do I get new clients?" No you don't have to create content, get active on social media or complete on job boards. Yes all of these help, but you're forced to play the waiting game. While your bills stack up... Instead you can proactively reach out to clients you want to work with. Here's how (and no, talking about your benefits is not enough). Yes, let's get proactive

Easy step by step tutorial: how to send a HTML email with Gmail