THE WORLD'S LARGEST WEB DEVELOPER SITE

How TO - Temperature Converter


Learn how to create a temperature converter with HTML and JavaScript.


Temperature Converter

Type a value in any of the fields to convert between temperature measurements:


Create a Temperature Converter

Create an input element that can convert a value from one temperature measurement to another.

Step 1) Add HTML:

Example - Fahrenheit to Celcius

<p>
  <label>Fahrenheit</label>
  <input id="inputFahrenheit" type="number" placeholder="Fahrenheit"
  oninput="temperatureConverter(this.value)"
  onchange="temperatureConverter(this.value)">
</p>
<p>Celsius: <span id="outputCelsius"></span></p>

Step 2) Add JavaScript:

Example - Fahrenheit to Celcius

/* When the input field receives input, convert the value from fahrenheit to celsius */
function temperatureConverter(valNum) {
  valNum = parseFloat(valNum);
  document.getElementById("outputCelsius").innerHTML=(valNum-32)/1.8;
}
Try it Yourself »

Convert from Fahrenheit to other Measurements

The table below shows how to convert from Fahrenheit to other temperature measurements:

Description Formula Example
Convert from Fahrenheit to Celsius ℃=(℉-32)/1.8 Try it
Convert from Fahrenheit to Kelvin K=((℉-32)/1.8)+273.15 Try it

Convert from Celsius to other Measurements

The table below shows how to convert from Celsius to other temperature measurements:

Description Formula Example
Convert from Celsius to Fahrenheit ℉=(℃*1.8)+32 Try it
Convert from Celsius to Kelvin K=℃+273.15 Try it

Convert from Kelvin to other Measurements

The table below shows how to convert from Kelvin to other temperature measurements:

Description Formula Example
Convert from Kelvin to Fahrenheit ℉=((K-273.15)*1.8)+32 Try it
Convert from Kelvin to Celsius ℃=K-273.15 Try it