diff --git a/Age Calculator/Age.html b/Age Calculator/Age.html
index 97afcedb9..68eecc915 100644
--- a/Age Calculator/Age.html	
+++ b/Age Calculator/Age.html	
@@ -1,29 +1,121 @@
 <!doctype html>
 <html lang="en">
 <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Age Calculator</title>
-    <link href="style.css" rel="stylesheet">
-    <link type="image/png" sizes="32x32" rel="icon" href="icons8-puzzle-16.png">
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"
-        integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Age Calculator</title>
+  <link href="style.css" rel="stylesheet" />
+  <link
+    href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css"
+    rel="stylesheet"
+    integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor"
+    crossorigin="anonymous"
+  />
+  <link
+    type="image/png"
+    sizes="32x32"
+    rel="icon"
+    href="icons8-puzzle-16.png"
+  />
+  <style>
+    body {
+      background: #f8f9fa;
+      min-height: 100vh;
+      display: flex;
+      flex-direction: column;
+    }
+    .container {
+      max-width: 400px;
+      margin-top: 3rem;
+      padding: 2rem;
+      background: white;
+      border-radius: 0.75rem;
+      box-shadow: 0 8px 20px rgb(0 0 0 / 0.1);
+    }
+    #age {
+      margin-top: 1rem;
+      font-weight: 600;
+      font-size: 1.25rem;
+      color: #0d6efd;
+    }
+    input {
+      text-align: center;
+      font-size: 1.25rem;
+      margin-bottom: 1rem;
+      border-radius: 0.375rem;
+      border: 1px solid #ced4da;
+      transition: border-color 0.3s ease;
+    }
+    input:focus {
+      border-color: #0d6efd;
+      box-shadow: 0 0 5px rgba(13, 110, 253, 0.5);
+      outline: none;
+    }
+    p.instructions {
+      font-weight: 500;
+      color: #6c757d;
+      margin-bottom: 1.5rem;
+    }
+    button#btn-start {
+      width: 100%;
+      font-size: 1.2rem;
+      font-weight: 600;
+    }
+    @media (max-width: 450px) {
+      .container {
+        margin: 2rem 1rem;
+        padding: 1.5rem;
+      }
+    }
+  </style>
 </head>
 <body>
-    <nav class="navbar navbar-dark bg-dark">
-        <div class="container-fluid">
-            <span class="navbar-brand mb-0 h1">Age Calculator</span>
-        </div>
-    </nav>
-    <div class="container">
-        <p id="currDate"> </p>
-        <p style="text-align: center;">Enter the DOB in format : (DD/MM/YYYY)</p><br>
-        <input type="text" id="date" placeholder="DD" required minlength="1" maxlength="2" ><br>
-        <input type="text" id="month" placeholder="MM" required minlength="1" maxlength="2" ><br>
-        <input type="text" id="year" placeholder="YYYY" required minlength="4" maxlength="4" ><br>
-        <button class="btn btn-primary" id="btn-start" onclick="return age()">Age</button><br>
-        <p id="age"></p>
+  <nav class="navbar navbar-dark bg-dark">
+    <div class="container-fluid">
+      <span class="navbar-brand mb-0 h1">Age Calculator</span>
     </div>
-    <script src="Age.js"></script>
+  </nav>
+  <div class="container shadow-sm">
+    <p class="instructions text-center">
+      Enter your Date of Birth in the format: <strong>DD / MM / YYYY</strong>
+    </p>
+    <div class="d-flex justify-content-between">
+      <input
+        type="text"
+        id="date"
+        placeholder="DD"
+        required
+        minlength="1"
+        maxlength="2"
+        class="form-control me-2"
+      />
+      <input
+        type="text"
+        id="month"
+        placeholder="MM"
+        required
+        minlength="1"
+        maxlength="2"
+        class="form-control me-2"
+      />
+      <input
+        type="text"
+        id="year"
+        placeholder="YYYY"
+        required
+        minlength="4"
+        maxlength="4"
+        class="form-control"
+      />
+    </div>
+    <button class="btn btn-primary mt-3" id="btn-start" onclick="return age()">
+      Calculate Age
+    </button>
+    <p id="age" class="text-center"></p>
+  </div>
+
+
+  
+  <script src="Age.js"></script>
 </body>
 </html>
diff --git a/Online Calculator/index.html b/Online Calculator/index.html
index 21d8e2583..458577c41 100644
--- a/Online Calculator/index.html	
+++ b/Online Calculator/index.html	
@@ -7,7 +7,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Calculator</title>
     <link rel="stylesheet" href="src/index.css">
-  <!-- Getting error while using this jquery func.(will be solved soon)  <script href="src/index.js"></script>-->
+  <!-- Getting error while using this jquery func.(will be solved soon)  <script src="src/index.js"></script>-->
 </head>
 <body>
     <div class="center">
diff --git a/Quiz-App/index.html b/Quiz-App/index.html
index a8d17c27e..cddd2999d 100644
--- a/Quiz-App/index.html
+++ b/Quiz-App/index.html
@@ -4,39 +4,43 @@
     <meta charset="UTF-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Quiz-app using js</title>
+    <title>Quiz App using JS</title>
     <link rel="stylesheet" href="style.css" />
   </head>
   <body>
     <div class="container">
       <h1 class="heading">Quiz</h1>
       <div class="main-dev">
-      <div class="inner-section">
-        <h2 class="question">Question came here</h2>
-        <ul>
-          <li>
-            <input type="radio" name="answer" id="ans-1" class="answer"/>
-            <label for="name" id="option-1">Option 1 </label>
-          </li>
-          <li>
-            <input type="radio" name="answer" id="ans-2" class="answer"/>
-            <label for="name" id="option-2">Option 2 </label>
-          </li>
-          <li>
-            <input type="radio" name="answer" id="ans-3" class="answer"/>
-            <label for="name" id="option-3">Option 3 </label>
-          </li>
-          <li>
-            <input type="radio" name="answer" id="ans-4"class="answer" />
-            <label for="name" id="option-4">Option 4 </label>
-          </li>
-        </ul>
-        <button id="submit">Submit</button>
-        <div id="showScore" class="scoreArea"></div>
+        <div class="inner-section">
+          <form id="quiz-form">
+            <fieldset>
+              <legend class="question">Question came here</legend>
+              <ul>
+                <li>
+                  <input type="radio" name="answer" id="ans-1" class="answer" />
+                  <label for="ans-1" id="option-1">Option 1</label>
+                </li>
+                <li>
+                  <input type="radio" name="answer" id="ans-2" class="answer" />
+                  <label for="ans-2" id="option-2">Option 2</label>
+                </li>
+                <li>
+                  <input type="radio" name="answer" id="ans-3" class="answer" />
+                  <label for="ans-3" id="option-3">Option 3</label>
+                </li>
+                <li>
+                  <input type="radio" name="answer" id="ans-4" class="answer" />
+                  <label for="ans-4" id="option-4">Option 4</label>
+                </li>
+              </ul>
+              <button type="submit" id="submit">Submit</button>
+            </fieldset>
+          </form>
+          <div id="showScore" class="scoreArea"></div>
+        </div>
       </div>
     </div>
-</div>
     <footer class="footer">Code by :- Rishika Vishnoi 😊 ⭐</footer>
+    <script src="script.js"></script>
   </body>
-  <script src="script.js"></script>
 </html>
diff --git a/Quote Generator/index.html b/Quote Generator/index.html
index f10c8aa68..36645fbfa 100644
--- a/Quote Generator/index.html	
+++ b/Quote Generator/index.html	
@@ -1,35 +1,88 @@
 <!doctype html>
 <html lang="en">
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport"
-          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-    <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <link rel="stylesheet" href="styles.css">
-    <title>Document</title>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+  <title>JavaScript Quote Generator</title>
+  <link rel="stylesheet" href="styles.css" />
+  <style>
+    /* Quick UI improvements, add more in styles.css if you want */
+    body {
+      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+      background: #f0f4f8;
+      color: #333;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 100vh;
+      margin: 0;
+      padding: 20px;
+      flex-direction: column;
+      text-align: center;
+    }
+    .heading {
+      font-size: 2.5rem;
+      font-weight: 700;
+      margin-bottom: 1.5rem;
+      color: #2c3e50;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+    }
+    .main-content {
+      background: white;
+      padding: 2rem 3rem;
+      border-radius: 12px;
+      box-shadow: 0 8px 24px rgba(0,0,0,0.1);
+      max-width: 600px;
+      width: 100%;
+    }
+    blockquote {
+      font-style: italic;
+      font-size: 1.5rem;
+      margin: 0 0 1rem 0;
+      color: #555;
+      line-height: 1.4;
+    }
+    .person {
+      font-weight: 600;
+      font-size: 1.25rem;
+      margin-bottom: 2rem;
+      color: #888;
+    }
+    button.generator {
+      background: #3498db;
+      border: none;
+      color: white;
+      padding: 0.75rem 2rem;
+      font-size: 1.1rem;
+      border-radius: 8px;
+      cursor: pointer;
+      transition: background-color 0.3s ease;
+      box-shadow: 0 4px 12px rgba(52, 152, 219, 0.3);
+    }
+    button.generator:hover {
+      background: #2980b9;
+      box-shadow: 0 6px 16px rgba(41, 128, 185, 0.5);
+    }
+    button.generator:focus {
+      outline: 3px solid #2980b9;
+      outline-offset: 2px;
+    }
+  </style>
 </head>
 <body>
 
-    <div class="heading">
-        JavaScript Quote Generator
-    </div>
+  <header class="heading" role="banner">JavaScript Quote Generator</header>
 
-    <div class="main-content">
-        <div class="text-area">
-            <span class="quote">
-       "At his best, man is the noblest of all animals; separated from law and justice he is the worst."
-            </span>
-        </div>
-        <div class="person">
-          - Aristotle
-        </div>
-        <button class="generator">Generate New Quote</button>
-    </div>
+  <main class="main-content" role="main" aria-live="polite" aria-atomic="true">
+    <blockquote class="text-area quote" id="quote">
+      "At his best, man is the noblest of all animals; separated from law and justice he is the worst."
+    </blockquote>
+    <div class="person" id="author">- Aristotle</div>
+    <button class="generator" id="generateBtn">Generate New Quote</button>
+  </main>
 
-
-
-<script src="Script.js">
-
-</script>
+  <script src="Script.js"></script>
 </body>
-</html>
\ No newline at end of file
+</html>
