<html>
<head>
<title>Temperature Converter</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f7f7f7;
}
h2 {
margin-top: 20px;
text-align: center;
}
form {
margin-top: 30px;
display: flex;
flex-direction: column;
align-items: center;
}
label {
margin-bottom: 10px;
}
input[type="number"] {
padding: 5px;
margin-bottom: 10px;
border-radius: 3px;
border: 1px solid #ccc;
width: 100%;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 3px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #3e8e41;
}
.result {
margin-top: 20px;
font-size: 18px;
font-weight: bold;
text-align: center;
}
</style>
</head>
<body>
<h2><a href="https://freesitetool.blogspot.com/" target="_blank">Temperature Converter</a></h2>
<form>
<label for="celsius">Enter temperature in Celsius:</label>
<input id="celsius" placeholder="Enter temperature in Celsius" type="number" />
<button onclick="convert()" type="button">Convert</button>
</form>
<div class="result" id="result"></div>
<br /><br />
<h3>About This Tool</h3>
<p>This tool is help to convert celsius temperature in kelvin and fahrenheit.</p>
<script>
function convert() {
// Get the Celsius temperature from the input field
const celsius = document.getElementById("celsius").value;
// Convert Celsius to Kelvin and Fahrenheit
const kelvin = parseFloat(celsius) + 273.15;
const fahrenheit = (parseFloat(celsius) * 9/5) + 32;
// Display the result
const result = document.getElementById("result");
result.innerHTML = `${celsius}°C is equal to ${kelvin}K and ${fahrenheit}°F`;
}
</script>
</body>
</html>
