Byte Converter Tool
Byte Converter Tool
Bytes
Kilobytes
Megabytes
Gigabytes
Terabytes
Convert
Conversion Results
Bytes:
Kilobytes:
Megabytes:
Gigabytes:
Terabytes:
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Arial', sans-serif;
background-color: #e0f7fa;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
color: #333;
}
.container {
background-color: #ffffff;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
width: 90%;
max-width: 600px;
text-align: center;
}
h1 {
color: #4CAF50;
margin-bottom: 20px;
}
.input-group {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
input, select {
width: 48%;
padding: 10px;
font-size: 16px;
border: 2px solid #ddd;
border-radius: 5px;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #45a049;
}
h2 {
color: #333;
margin-top: 20px;
}
#results {
text-align: left;
font-size: 18px;
}
@media (max-width: 600px) {
.input-group {
flex-direction: column;
}
input, select {
width: 100%;
margin-bottom: 10px;
}
}
function convertBytes() {
const inputValue = parseFloat(document.getElementById('inputValue').value);
const inputUnit = document.getElementById('inputUnit').value;
if (isNaN(inputValue) || inputValue < 0) {
alert("Please enter a valid positive number");
return;
}
const units = {
bytes: 1,
kilobytes: 1024,
megabytes: 1024 * 1024,
gigabytes: 1024 * 1024 * 1024,
terabytes: 1024 * 1024 * 1024 * 1024
};
const bytes = inputValue * units[inputUnit];
document.getElementById('bytesResult').innerHTML = `Bytes: ${bytes}`;
document.getElementById('kilobytesResult').innerHTML = `Kilobytes: ${(bytes / 1024).toFixed(4)}`;
document.getElementById('megabytesResult').innerHTML = `Megabytes: ${(bytes / (1024 ** 2)).toFixed(4)}`;
document.getElementById('gigabytesResult').innerHTML = `Gigabytes: ${(bytes / (1024 ** 3)).toFixed(4)}`;
document.getElementById('terabytesResult').innerHTML = `Terabytes: ${(bytes / (1024 ** 4)).toFixed(4)}`;
}
document.getElementById('convertButton').addEventListener('click', convertBytes);
Features:
Byte Converter: Convert values between bytes, kilobytes, megabytes, gigabytes, and terabytes.
Responsive Design: Adapts to smaller screens and mobile devices.
Conversion Results: Displays the converted values for all units (Bytes, Kilobytes, Megabytes, Gigabytes, Terabytes).
How It Works:
Input Value: The user enters the number to convert.
Select Unit: The user selects the input unit (Bytes, Kilobytes, Megabytes, Gigabytes, Terabytes).
Convert: On clicking the "Convert" button, the JavaScript logic converts the value into different byte units and displays the results.
This tool uses basic unit conversion logic in JavaScript and provides a clean, user-friendly interface with colorful styling.
.png)
.png)
Comments
Post a Comment