Voltage Divider Calculator Using JavaScript HTML With Example

Hello Friends Today, through this tutorial, I will tell you How to Write Program voltage divider calculator using PHP with HTML? Sure! Below is a simple example of a voltage divider calculator using HTML and JavaScript:


<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Voltage Divider Calculator</title>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
label {
display: block;
margin-bottom: 5px;
input[type="number"] {
width: 100px;
margin-bottom: 10px;
button {
padding: 8px 16px;
background-color: #007bff;
color: #fff;
border: none;
cursor: pointer;
border-radius: 4px;
button:hover {
background-color: #0056b3;
<h2>Voltage Divider Calculator</h2>
<label for="vin">Input Voltage (Vin):</label>
<input type="number" id="vin" step="0.1" min="0">
<label for="r1">Resistor 1 (R1) in ohms:</label>
<input type="number" id="r1" step="1" min="0">
<label for="r2">Resistor 2 (R2) in ohms:</label>
<input type="number" id="r2" step="1" min="0">
<button onclick="calculateVoltage()">Calculate Voltage</button>
<p id="result"></p>
function calculateVoltage() {
var vin = parseFloat(document.getElementById('vin').value);
var r1 = parseFloat(document.getElementById('r1').value);
var r2 = parseFloat(document.getElementById('r2').value);
if (!isNaN(vin) && !isNaN(r1) && !isNaN(r2) && r1 !== 0) {
var vout = vin * (r2 / (r1 + r2));
document.getElementById('result').innerHTML = "Output Voltage (Vout): " + vout.toFixed(2) + " volts";
} else {
document.getElementById('result').innerHTML = "Please enter valid numbers for Vin, R1, and R2";

This code creates a simple HTML page with input fields for input voltage (Vin), resistor 1 (R1), and resistor 2 (R2). When the “Calculate Voltage” button is clicked, it calculates the output voltage (Vout) using the voltage divider formula and displays the result below the button.


Voltage Divider Calculator