diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 65a866cd..c016e447 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -13,7 +13,45 @@ <h1>Product Pick</h1>
     </header>
     <main>
       <form>
-        <!-- write your html here-->
+        <fieldset>
+    <legend>Order Your T-Shirt</legend>
+
+    <!-- Customer Name -->
+    <label for="name">Name:</label>
+    <input type="text" id="name" name="name" required pattern="[A-Za-z\s\-']{2,50}" title="Name must be 2–50 characters, letters only">
+    <br><br>
+
+    <!-- Email -->
+    <label for="email">Email:</label>
+    <input type="email" id="email" name="email" required>
+    <br><br>
+
+    <!-- T-shirt Colour -->
+    <label for="colour">Choose a colour:</label>
+    <select id="colour" name="colour" required>
+      <option value="">--Please choose--</option>
+      <option value="black">Black</option>
+      <option value="white">White</option>
+      <option value="red">Red</option>
+    </select>
+    <br><br>
+
+    <!-- Size -->
+    <label for="size">Size:</label>
+    <select id="size" name="size" required>
+      <option value="">--Select a size--</option>
+      <option value="xs">XS</option>
+      <option value="s">S</option>
+      <option value="m">M</option>
+      <option value="l">L</option>
+      <option value="xl">XL</option>
+      <option value="xxl">XXL</option>
+    </select>
+    <br><br>
+
+    <!-- Submit Button -->
+    <button type="submit">Submit</button>
+  </fieldset><!-- write your html here-->
         <!-- 
           try writing out the requirements first as comments
         this will also help you fill in your PR message later-->
diff --git a/Wireframe/index.html b/Wireframe/index.html
index 0e014e53..e46f8601 100644
--- a/Wireframe/index.html
+++ b/Wireframe/index.html
@@ -10,23 +10,26 @@
     <header>
       <h1>Wireframe</h1>
       <p>
-        This is the default, provided code and no changes have been made yet.
+        Redefine the as is with the end in mind with a wireframe that is simple,
+        easy to use, and easy to understand.
       </p>
     </header>
     <main>
       <article>
-        <img src="placeholder.svg" alt="" />
-        <h2>Title</h2>
+        <img src="https://unsplash.com/photos/text-0tSiofevpUs" alt="" />
+        <h2>What is a wireframe? A guide for non-designers</h2>
         <p>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-          voluptates. Quisquam, voluptates.
+          A wireframe is a visual blueprint or outline of a website or application page, focusing on structure, layout, 
+          and functionality rather than aesthetics. It serves as a foundation for the design, 
+          helping to plan content placement, navigation, and user flow before diving into visual elements. 
+.
         </p>
-        <a href="">Read more</a>
+        <a href="https://balsamiq.com/learn/articles/what-are-wireframes/">Read more</a>
       </article>
     </main>
     <footer>
       <p>
-        This is the default, provided code and no changes have been made yet.
+        Wireframes are your blueprint: a simple, visual guide to quickly lay out your ideas and show how everything fits together.
       </p>
     </footer>
   </body>