diff --git a/Wireframe/index.html b/Wireframe/index.html
index 0e014e535..efb67437a 100644
--- a/Wireframe/index.html
+++ b/Wireframe/index.html
@@ -8,25 +8,43 @@
   </head>
   <body>
     <header>
-      <h1>Wireframe</h1>
+      <h1>Wireframe and more</h1>
       <p>
-        This is the default, provided code and no changes have been made yet.
+        This short article talks about wireframe, Git branch and ReadMe
       </p>
     </header>
     <main>
       <article>
-        <img src="placeholder.svg" alt="" />
-        <h2>Title</h2>
+        <img src="wireframePicture.avif" alt="placeholder.svg" />
+        <h2>Wireframe</h2>
         <p>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-          voluptates. Quisquam, voluptates.
+          A wireframe is a basic, two-dimensional visual representation of a web page, app interface, or product layout. You can think of it as a low-fidelity, functional sketch.
+          Wireframes typically depict only functionality, not the true style and visual elements of the final product.
         </p>
-        <a href="">Read more</a>
+        <a href="https://www.productplan.com/glossary/wireframe">Wireframe</a>
+      </article>
+
+      <article>
+        <img src="https://miro.medium.com/v2/resize:fit:720/format:webp/1*K9scAx1Ezd-KJFabaYseCw.jpeg" alt="placeholder.svg" />
+        <h2>Git Branch</h2>
+        <p>
+          A git branch is like a separate work space that allows developers to make changes without affecting the main repository.
+        </p>
+        <a href="https://www.w3schools.com/git/git_branch.asp">Git Branch</a>
+      </article>
+
+      <article>
+        <img src="https://media.licdn.com/dms/image/v2/D5612AQF_jGTodjhpiQ/article-cover_image-shrink_720_1280/article-cover_image-shrink_720_1280/0/1690540082500?e=2147483647&v=beta&t=1pDD2reY31U4rxxGXjDcd-IFNknrqQtE42SJFJb65to" alt="placeholder.svg" />
+        <h2>ReadMe file</h2>
+        <p>
+          Developers use readme files to explain their projects to others. It communicates important information about your project.
+        </p>
+        <a href="https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/customizing-your-repository/about-readmes">ReadMe File</a>
       </article>
     </main>
     <footer>
       <p>
-        This is the default, provided code and no changes have been made yet.
+        End of Article
       </p>
     </footer>
   </body>
diff --git a/Wireframe/style.css b/Wireframe/style.css
index be835b6c7..c5950525f 100644
--- a/Wireframe/style.css
+++ b/Wireframe/style.css
@@ -53,6 +53,9 @@ footer {
   position: fixed;
   bottom: 0;
   text-align: center;
+  width: 100%;
+  background-color: #0F172A;
+  color: #F8FAFC;
 }
 /* ====== Articles Grid Layout ====
 Setting the rules for how articles are placed in the main element.
diff --git a/Wireframe/wireframePicture.avif b/Wireframe/wireframePicture.avif
new file mode 100644
index 000000000..07360f81f
Binary files /dev/null and b/Wireframe/wireframePicture.avif differ
