diff --git a/domlab.css b/domlab.css
new file mode 100644
index 0000000..175a3b6
--- /dev/null
+++ b/domlab.css
@@ -0,0 +1,28 @@
+h1 {
+    font-size: 30px;
+
+}
+
+.first {
+    display:block;
+    position:relative;
+}
+
+#userInput, label {
+    display:block;
+    position: relative;
+    top: 10%;
+    left: 35%;
+    width: 25%;
+    text-align: center;
+    
+    
+}
+
+#calculate {
+    display: block;
+    position: absolute;
+    top: 16%;
+    left: 75%;
+    text-align: center;
+}
\ No newline at end of file
diff --git a/domlab.html b/domlab.html
new file mode 100644
index 0000000..79b1409
--- /dev/null
+++ b/domlab.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=, initial-scale=1.0">
+    <title>Temperature Scale Convertor</title>
+    
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
+</head>
+<body>
+    <div class = 'container border border-dark'>
+        <h1 class="position-absolute top-0 start-50 translate-middle-x">Temperature Scale Convertor</h1>
+            
+
+                
+                <form>
+                <br>
+                <p class = "first" id = "fahrenheit">Fahrenheit
+                
+                
+                    <label>Value</label>
+                    <input type = 'text' class = "first"  id = "userInput"/> 
+                    <input type = 'button' class = "first"  id = 'calculate' onClick = 'calc()' value = 'Calculate'/>
+                    
+                </p>
+                    <p class = 'Celsius'>Celsius <br>
+                    
+                    <span id = "cValue"></span>
+                    </p>
+                    <p class = 'kelvin'>kelvin <br>
+                        <span id = 'kelvin'></span>
+                    </p>
+
+                    <p class = 'rankine'>Rankine <br>
+                        <span id = 'rankine'></span>
+                    </p>
+                </form>
+        
+            
+    </div>
+    <script src = "domlab.js"  defer></script>
+    <link href = "domlab.css" rel = "stylesheet"></script>
+</body>
+</html>
diff --git a/domlab.js b/domlab.js
new file mode 100644
index 0000000..974b43c
--- /dev/null
+++ b/domlab.js
@@ -0,0 +1,20 @@
+
+// celsius convertor
+function calc(){
+    let userInput = parseInt(document.getElementById('userInput').value)
+    
+    // celsius
+    let cValue = (userInput - 32) * (5/9)
+    document.getElementById('cValue').innerHTML = cValue
+    
+    // kelvin
+    let kelvin = (userInput - 32) * (5/9) + 273.15
+    document.getElementById('kelvin').innerHTML = kelvin
+
+    // rankine
+    let rankine = userInput + 459.67
+    document.getElementById('rankine').innerHTML = rankine
+
+    
+
+}
