Code Media

Simple Password Generator with JavaScript (Free Code)

If you want to create Password Generator using JavaScript then this tutorial is for you. Here I will discuss with you what is JavaScript Password Generator and how it is created. The design I will show you here is a random password generator. In the case of Random Password Generator, you will not be able … Read more

EMI Calculator Using HTML, CSS and JavaScript

JavaScript EMI Calculator

If you want to make a javascript EMI calculator then this tutorial is for you. Here I will discuss with you how to create a loan calculator using JavaScript.

There are different types of interest rate calculator or emi calculator. However, the design that I have created here is absolutely simple. Basically, it will be suitable for you if you are a beginner.

In this tutorial, you will learn about JavaScript and how to create an EMI calculator JavaScript. Here I will discuss everything with you. What could be the problem and how to make it easier.

JavaScript EMI Calculator

There are many types of tutorials on the internet for creating emi calculator HTML. However, in this article, you will find a lot of advanced and extra information. 

The loan calculator will basically help you to know how much you have to pay per month including the interest of any loan amount.

For example, you have taken a loan of 1000 rupees or you are buying a product which costs 1000 rupees. There is 5% interest per year. 

Now you want to return that money in 6 months. Then you can calculate how much money you have to pay per month with this interest rate calculator.

If you are having difficulty understanding what I am saying then be sure to follow the preview below.

See the Pen
EMI Calculator
by Shantanu Jana (@shantanu-jana)
on CodePen.

Hope you liked the demo above and that you know how this JavaScript Loan Calculator works. With the help of HTML, I created the input boxes and added some basic text here. 

I have designed all the information by CSS. The most important thing here is JavaScript. There is a manual formula for calculating emi that EMI calculator formula I have added by JavaScript.

How to Create a EMI Calculator with JavaScript

Of course to make this simple EMI calculator you need to have some idea about HTML CSS and JavaScript. To make this JavaScript loan calculator you need to follow a few steps below.

Make a box on the webpage

Now I have created a basic area of ​​this emi calculator. This means that a box has been created at the top of the webpage in which all the input boxes and information of this loan calculator can be seen. The width of this box: 345px, height: 420px and background color white has been used.

<div id=”loancal”>
body {
  background: #ffffff;
  font-family: sans-serif;
#loancal {
  width: 345px;
  height: 420px;
  background-color: white;
  color: #fff;
  padding: 10px;
  margin: 100px auto;
  border-radius: 3px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
Make a box on the webpage

Add headings to EMI Calculator

Read more