diff --git a/index.html b/index.html
new file mode 100644
index 0000000..27ba580
--- /dev/null
+++ b/index.html
@@ -0,0 +1,20 @@
+
+
+
+
+
+
+ Task-1
+
+
+
+
+
+
+
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..a313f58
--- /dev/null
+++ b/index.js
@@ -0,0 +1,26 @@
+const randomNumber = Math.floor(Math.random() * 10) + 1;
+console.log(randomNumber);
+
+const output = document.getElementById("output");
+
+let trial = 0;
+
+function checkNumber() {
+ trial += 1;
+ let number = document.getElementById("num").value;
+ if (number) {
+ const ans =
+ randomNumber < number
+ ? ((output.innerHTML = `Number is high.`),
+ (output.style.color = "red"))
+ : randomNumber > number
+ ? ((output.innerHTML = `Number is low.`),
+ (output.style.color = "red"))
+ : ((output.innerHTML = `Correct guess - ${trial} Trials.`),
+ (output.style.color = "green"));
+ document.getElementById("num").value = "";
+ } else {
+ output.innerHTML = "Please enter the number.";
+ output.style.color = "red";
+ }
+}
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..88d3c5a
--- /dev/null
+++ b/style.css
@@ -0,0 +1,77 @@
+* {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+ background-color: #42f569;
+ color: #0a174e;
+ font-family: Arial, sans-serif;
+}
+.game {
+ text-align: center;
+}
+.title {
+ background-color:blue;
+ color: #f5d042;
+ font-size: 50px;
+}
+h3 {
+ margin: 30px 0 0 0;
+ font-size: 35px;
+}
+input[type="number"] {
+ height: 30px;
+ width: 150px;
+
+ padding: 5px;
+
+ font-size: 14px;
+
+ border: 1px solid #ccc;
+ border-radius: 5px;
+
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+
+ background-color: #f5f5f5;
+
+ text-align: center;
+
+ -moz-appearance: textfield;
+ appearance: textfield;
+}
+
+input[type="number"]::-webkit-inner-spin#btn1,
+input[type="number"]::-webkit-outer-spin#btn1 {
+ -webkit-appearance: none;
+ margin: 0;
+}
+
+input[type="number"]:hover,
+input[type="number"]:focus {
+ border-color: #888;
+ outline: none;
+}
+
+#btn1 {
+ padding: 10px 20px;
+
+ font-family: Arial, sans-serif;
+ font-size: 14px;
+
+ border: none;
+ border-radius: 5px;
+
+ background-color: #0a174e;
+ color: #f5d042;
+
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+
+ transition: background-color 0.3s ease;
+}
+#btn1:hover {
+ background-color: #4b60c2;
+}
+#btn1:focus {
+ outline: none;
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+}
+