Update README.md

README.md

@@ -38,11 +38,18 @@ thumbnail: "https://huggingface.co/Mooshie/hairflap/blob/main/girl1.png"
         flex-direction: column;
         align-items: center;
       }
+      .gallery {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        margin-top: 20px;
+      }
       .image-container {
-        width: 40%;
+        width: 30%;
         max-width: 100%;
         cursor: pointer;
         text-align: center;
+        margin-bottom: 20px;
       }
       .image-container img {
         width: 100%;
@@ -64,9 +71,20 @@ thumbnail: "https://huggingface.co/Mooshie/hairflap/blob/main/girl1.png"
         <h1>Explore Hairflap LoRA Model</h1>
       </a>
       <p>This LoRA model works with values between 1.0 and 1.5. Use 1.0 for simpler hairstyles like long hair, and use 1.5 for more difficult hairstyles like short hair, twintails, or ponytails.</p>
-      <div class="image-container">
-        <img src="girl1.png" alt="girl with hair flaps" loading="lazy">
+      <div class="gallery">
+        <div class="image-container">
+          <img src="girl1.png" alt="girl with hair flaps" loading="lazy">
+        </div>
+        <div class="image-container">
+          <img src="placeholder1.jpg" alt="Placeholder 1" loading="lazy">
+        </div>
+        <div class="image-container">
+          <img src="placeholder2.jpg" alt="Placeholder 2" loading="lazy">
+        </div>
+        <div class="image-container">
+          <img src="placeholder3.jpg" alt="Placeholder 3" loading="lazy">
+        </div>
       </div>
     </div>
   </body>
-</html>
+</html>