Temperature Converter Source Code

<!-- TEMPERATURE CONVERTER PROJECT -->
<!-- Features: Celsius, Fahrenheit, Kelvin conversion, real-time calculations -->

<!-- HTML STRUCTURE -->
<div class="container">
    <h1>🌡️ Temperature Converter</h1>
    
    <div class="converter-box">
        <div class="input-group">
            <div class="input-field">
                <label>Celsius (°C)</label>
                <input type="number" id="celsius" placeholder="Enter °C" oninput="celsiusChange()">
            </div>
            <div class="input-field">
                <label>Fahrenheit (°F)</label>
                <input type="number" id="fahrenheit" placeholder="Enter °F" oninput="fahrenheitChange()">
            </div>
            <div class="input-field">
                <label>Kelvin (K)</label>
                <input type="number" id="kelvin" placeholder="Enter K" oninput="kelvinChange()">
            </div>
        </div>
        <button onclick="resetValues()">Reset</button>
    </div>
</div>

<!-- CONVERSION FORMULAS -->
// °F = (°C × 9/5) + 32
// K = °C + 273.15
// °C = (°F - 32) × 5/9

<!-- JAVASCRIPT FUNCTIONS -->
const celsiusInput = document.getElementById('celsius');
const fahrenheitInput = document.getElementById('fahrenheit');
const kelvinInput = document.getElementById('kelvin');

function celsiusChange() {
    const c = parseFloat(celsiusInput.value);
    
    if (!isNaN(c)) {
        fahrenheitInput.value = ((c * 9/5) + 32).toFixed(2);
        kelvinInput.value = (c + 273.15).toFixed(2);
    } else {
        fahrenheitInput.value = '';
        kelvinInput.value = '';
    }
}

function fahrenheitChange() {
    const f = parseFloat(fahrenheitInput.value);
    
    if (!isNaN(f)) {
        const c = (f - 32) * 5/9;
        celsiusInput.value = c.toFixed(2);
        kelvinInput.value = (c + 273.15).toFixed(2);
    } else {
        celsiusInput.value = '';
        kelvinInput.value = '';
    }
}

function kelvinChange() {
    const k = parseFloat(kelvinInput.value);
    
    if (!isNaN(k)) {
        const c = k - 273.15;
        celsiusInput.value = c.toFixed(2);
        fahrenheitInput.value = ((c * 9/5) + 32).toFixed(2);
    } else {
        celsiusInput.value = '';
        fahrenheitInput.value = '';
    }
}

function resetValues() {
    celsiusInput.value = '';
    fahrenheitInput.value = '';
    kelvinInput.value = '';
    celsiusInput.focus();
}

<!-- KEY CONCEPTS -->
// parseFloat(): Convert string to decimal number
// isNaN(): Validate that input is a valid number
// toFixed(2): Round result to 2 decimal places
// oninput event: Trigger conversion as user types
// Real-time calculation: Update other fields instantly