How to send an email using JavaScript?

JavaScript is a web programming language that makes our web pages and web applications interactive by giving them the ability to think and act. SMTP.JS (Simple Mail Transfer Protocol) is a JavaScript library that helps us send data or in our case email to a specific server. However, it should be kept in mind that it will only be used to send emails so it will only work with outgoing emails. In this post, we will see how to send an email using JavaScript and with the help of SMTP we will achieve our goal.


There are two things you need before we start coding. First, you have to change the Gmail account settings that you will use to send an email such as if 2 step authentication is set up on your Gmail account then revoke it and then allow less secure apps to access Gmail which we can achieve by visiting the Gmail Settings page.

Turn on less secure apps:

Sending Email using JavaScript

HTML: We will first design the structure of our web application. For that copy or type the HTML code in your favorite editor.

<!DOCTYPE html>

<html lang="en">


    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Send Email</title>



    <form method="post" name="Form">

        <input type="Email" name="sender" placeholder="[email protected]"><br>

        <input type="Password" name="password" placeholder="type password here"><br>

        <input type="Email" name="reciever" placeholder="[email protected]"><br>

        <input type="text" name="Message" placeholder="Enter Email Content" id="Message"><br>

        <input type="button" value="Send Email" onclick="sendMail()">


    <script src=""></script>



In the above code, we used the input tags of HTML to define input boxes for sender email and password and receiver email. Apart from that we also defined a button that says Send Email and initiated an event listener that will continuously listen for the click event which means every time a user clicks on the Send Email button the sendMail() function will start executing. All of the input fields are then placed in a form tag which has a method of post and the name of Form. We will use this name to get the values of input fields of this Form.

In the end, we used the script tag to include SMTP protocol and then another script tag to reference the JavaScript file(code.js) that has the function sendMail().

JavaScript: In JavaScript, we initiated the sendMail() function and then stored all the values of the input fields defined in HTML. We achieve this task by referencing the input fields with the name they were given earlier in HTML.

After getting all the values, we will send the email using these values. If the process of sending an email is successful we will see an alert of Email Sent Successfully.

function sendMail() {

  //getting values from input fields

  var sender=Form.sender.value;

  var password=Form.password.value;

  var receiver=Form.reciever.value;

  var content=Form.content.value;

  //Sending email


  Host: "",

  Username: sender,


  To: receiver,

  From: sender,

  Subject: "Check Email Sending",

  Body: content,

  }).then(function (message) {

  alert("Email sent successfully")



Fill all the required credentials and then click on the Send Email button:

Now go to your Gmail account and you will see that you have received an Email:


JavaScript is a programming language in which we can develop and design web pages. The SMTP library in JavaScript is a simple mail transfer mechanism that is used to send emails. In this post, we answered the question of how to send email using JavaScript by first defining our web application structure using HTML, and then we went on to JavaScript to implement the proper functionality.

About the author

Shehroz Azam

A Javascript Developer & Linux enthusiast with 4 years of industrial experience and proven know-how to combine creative and usability viewpoints resulting in world-class web applications. I have experience working with Vue, React & Node.js & currently working on article writing and video creation.