diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..7746532
Binary files /dev/null and b/.DS_Store differ
diff --git a/app.js b/app.js
new file mode 100644
index 0000000..504a4dd
--- /dev/null
+++ b/app.js
@@ -0,0 +1,123 @@
+let farenheitVal = document.querySelector("#farenheit");
+let celsiusVal = document.querySelector("#celsius");
+let kelvinVal = document.querySelector("#kelvin");
+let rankineVal = document.querySelector("#rankine");
+let scaleType= document.querySelector('#scale');
+
+document.querySelector('#calcButton').addEventListener('click', totalConverts());
+
+// To farenheit
+let celsiusFarenheit = (userNumber) =>{
+    let farenheitValue= document.querySelector('#tempValue').value;
+    let output = parseInt(fahrenheitValue) - 32 * 5/9;
+    celsiusTextVal.innerHTML = output.toFixed(2) + ' C'
+};
+function farenheitValue () {
+    fahrenheitVal.innerHTML = document.querySelector('#tempValue').value + ' F'
+};
+let kelvinFarenheit = (userNumber) => { 
+    let farenheitValue=  document.querySelector('#tempValue').value + 'K';
+    let output = (parseInt(fahrenheitValue) - 32) * 5/9 + 273.15;
+    kelvinValue.innerHTML = product.toFixed(2) + ' K'
+let rankineFarenheit = (userNumber) => {
+    let fahrenheitValue = document.querySelector('#tempValue').value
+    let product = (parseInt(fahrenheitValue) + 459.67);
+    rankineValue.innerHTML = product.toFixed(2) + ' R'
+};
+
+
+// From celsius
+
+function celsiusValue () {
+    celsiusTextVal.innerHTML = document.querySelector('#tempBox').value + ' C'
+}
+
+function farenheitCelsius () {
+    let celsiusInput = document.querySelector('#tempBox').value
+    let product = (parseInt(celsiusInput) * 9/5) + 32
+    fahrenheitTextVal.innerHTML = product.toFixed(2) + ' F'
+}
+
+function kelvinCelsius () {
+    let celsiusInput = document.querySelector('#tempBox').value
+    let product = parseInt(celsiusInput) + 273.15
+    kelvinTextVal.innerHTML = product.toFixed(2) + ' K'
+}
+
+function rankineCelsius () {
+    let celsiusInput = document.querySelector('#tempBox').value
+    let product = parseInt(celsiusInput) * 9/5 + 491.67
+    rankineTextVal.innerHTML = product.toFixed(2) + ' R'
+}
+
+// From Kelvin
+function kelvinValue () {
+    kelvinTextVal.innerHTML = document.querySelector('#tempValueBox').value + ' K'
+}
+
+function farenheitKelvin () {
+    let kelvinInput = document.querySelector('#tempBox').value
+    let product = (parseInt(kelvinInput) - 273.15) * 9/5 + 32
+    fahrenheitTextVal.innerHTML = product.toFixed(2) + ' F'
+}
+
+function celsiusKelvin () {
+    let kelvinInput = document.querySelector('#tempBox').value
+    let product = parseInt(kelvinInput) - 273.15
+    celsiusTextVal.innerHTML = product.toFixed(2) + ' C'
+}
+
+function rankineKelvin() {
+    let kelvinInput = document.querySelector('#tempBox').value
+    let product = parseInt(kelvinInput) * 1.8
+    rankineTextVal.innerHTML = product.toFixed(2) + ' R'
+}
+
+// From rankine
+function rankineValue () {
+    rankineTextVal.innerHTML = document.querySelector('#tempBox').value + ' R'
+}
+
+function farenheitRankine () {
+    let rankineInput = document.querySelector('#tempBox').value
+    let product = parseInt(rankineInput) - 459.67
+    fahrenheitTextVal.innerHTML = product.toFixed(2) + ' F'
+}
+
+function celsiusRankine () {
+    let rankineInput = document.querySelector('#tempBox').value
+    let product = (parseInt(rankineInput) - 491.67) * 5/9
+    celsiusTextVal.innerHTML = product.toFixed(2) + ' C'
+}
+
+function kelvinRankine () {
+    let rankineInput = document.querySelector('#tempBox').value
+    let product = parseInt(rankineInput) * 5/9
+    kelvinTextVal.innerHTML = product.toFixed(2) + ' K'
+}
+
+// Determine which formula to use;
+function totalConverts () {
+if(scale.value === "farenheit"){
+    celsiusFarenheit()
+    rankineFarenheit()
+    kelvinToFahrenheit()
+    farenheitValue();
+} else if(scale.value === "celsius"){
+    farenheitCelsius()
+    celsiusValue()
+    rankineCelsius()
+    kelvinCelsius();
+} else if(scale.value === "kelvin"){
+    kelvinValue()
+    kelvinFarenheit()
+    kelvinCelsius()
+    kelvinRankine();
+} else{
+    rankineValue()
+    farenheitRankine()
+    celsiusRankine()
+    kelvinRankine();
+}
+}
+};
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..b8c41e2
--- /dev/null
+++ b/index.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <link rel="stylesheet" href="styles.css">
+</head>
+
+<body>
+<div class="calculator">
+<h2><strong>Temperature Scale Converter</strong></h2>
+
+
+<label for="scale" >Scale</label>
+<select name="scale" id="scale">
+  <option value="farenheit" id="farenheit">Farenheit</option>
+  <option value="celsius" id="celsius">Celsius</option>
+  <option value="kelvin" id="kelvin">Kelvin</option>
+  <option value="rankine" id="rankine">Rankine</option>
+</select>
+
+<label for="value" id="tempValue">Value</label>
+    <input type="number" value="number" id="tempValue">
+    
+    
+    <button id="calcButton">Calculate</button><br>
+
+<div id="farenheitOutput" class="output">Farenheit</div>
+<div id="celsiusOutput" class="output">Celsius</div>
+<div id="kelvinOutput" class="output">Kelvin</div>
+<div id="rankineOutput" class="output">Rankine</div>
+
+
+</div>
+<script src="app.js"></script>
+
+
+
+  
+</body>
+
+</html>
\ No newline at end of file
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..005692e
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,19 @@
+.calculator{
+    border: solid;
+    width: 28.125rem;
+    padding: 5%;
+}
+
+.output {
+    display: inline;
+    margin: 5%;
+}
+
+#scale {
+    margin-bottom: 5%;
+}
+
+
+#calcButton {
+    margin-left: 5%;
+}
\ No newline at end of file