Raelina
/

Raehoshi-illust-XL

@@ -12,176 +12,91 @@ tags:
 base_model: OnomaAIResearch/Illustrious-xl-early-release-v0
 ---
 <style>
-  .title-container {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 100vh; /* Adjust this value to position the title vertically */
-  }
-  .title {
-    font-size: 2.5em;
-    text-align: center;
-    color: #333;
-    font-family: 'Helvetica Neue', sans-serif;
-    text-transform: uppercase;
-    letter-spacing: 0.1em;
-    padding: 0.5em 0;
-    background: transparent;
-  }
-  .title span {
-    background: -webkit-linear-gradient(45deg, #CB80AB, #AB886D);
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-  }
-  .custom-table {
-   table-layout: fixed;
-   width: 100%;
-   border-collapse: collapse;
-   margin-top: 2em;
- }
- .custom-table td {
-   width: 50%;
-   vertical-align: top;
-   padding: 10px;
-   box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.15);
- }
- .custom-image-container {
-   position: relative;
-   width: 100%;
-   margin-bottom: 0em;
-   overflow: hidden;
-   border-radius: 10px;
-   transition: transform .7s;
- }
- .custom-image-container:hover {
-   transform: scale(1.05);
- }
- .custom-image {
-   width: 100%;
-   height: auto;
-   object-fit: cover;
-   border-radius: 10px;
-   transition: transform .7s;
-   margin-bottom: 0em;
- }
- .nsfw-filter {
-   filter: blur(8px);
-   transition: filter 0.3s ease;
- }
- .custom-image-container:hover .nsfw-filter {
-   filter: none;
- }
- .overlay {
-   position: absolute;
-   bottom: 0;
-   left: 0;
-   right: 0;
-   color: white;
-   width: 100%;
-   height: 40%;
-   display: flex;
-   flex-direction: column;
-   justify-content: center;
-   align-items: center;
-   font-size: 1vw;
-   font-style: bold;
-   text-align: center;
-   opacity: 0;
-   background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 60%, rgba(0, 0, 0, 0) 100%);
-   transition: opacity .5s;
- }
- .custom-image-container:hover .overlay {
-   opacity: 1;
- }
- .overlay-text {
-   background: linear-gradient(45deg, #F1F8E8, #F1F8E8);
-   -webkit-background-clip: text;
-   color: transparent;
-   text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
- }
- .overlay-subtext {
-   font-size: 0.75em;
-   margin-top: 0.5em;
-   font-style: italic;
- }
- .overlay,
- .overlay-subtext {
-   text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
- }
 </style>
-<h1 class="title">
-  <span>Raehoshi illust XL</span>
-</h1>
-<table class="custom-table">
- <tr>
-   <td>
-     <div class="custom-image-container">
-       <img class="custom-image" src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/LvchW9oQFPaqAViwsugE3.png" alt="Sample Image 1">
-       <div class="overlay">
-         <div class="overlay-text">Changli</div>
-       </div>
-     </div>
-   </td>
-   <td>
-     <div class="custom-image-container">
-       <img class="custom-image" src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/euiTvkHQ9hoqTu2fRFvkS.png" alt="Sample Image 2">
-       <div class="overlay">
-         <div class="overlay-text">Jane Doe</div>
-       </div>
-     </div>
-   </td>
-   <td>
-     <div class="custom-image-container">
-       <img class="custom-image" src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/iwwZTKqRmc1s0sBfbWpds.png" alt="Sample Image 3">
-       <div class="overlay">
-         <div class="overlay-text">Raora Panthera</div>
-       </div>
-     </div>
-   </td>
- </tr>
- <tr>
-   <td>
-     <div class="custom-image-container">
-       <img class="custom-image" src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/YnqYRkB4pn7OUS9XY7K_o.png" alt="Sample Image 4">
-       <div class="overlay">
-         <div class="overlay-text">Alisa Mikhailovna Kujou</div>
-       </div>
-     </div>
-   </td>
-   <td>
-     <div class="custom-image-container">
-       <img class="custom-image" src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/gtbbfmKDbZ2baXt1E3fIL.png" alt="Sample Image 5">
-       <div class="overlay">
-         <div class="overlay-text">Feixiao</div>
-       </div>
-     </div>
-   </td>
-   <td>
-     <div class="custom-image-container">
-       <img class="custom-image" src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/GhbVNdOjx833Rq4gMdtZU.png" alt="Sample Image 6">
-       <div class="overlay">
-         <div class="overlay-text">Otonose Kanade</div>
-       </div>
-     </div>
-   </td>
- </tr>
-</table>
 ## Overview
 Introducing **Raehoshi illust XL** , an enhanced iteration built upon the Illustrious XL v0.1 model. It aims to elevate the visual style by addressing some of the limitations in the original, such as oversaturation and artifact noise. While these issues are not entirely eliminated, noticeable improvements have been made, and further refinements will continue. The goal is to deliver a more polished, balanced output while staying true to the strengths of the base model.

 base_model: OnomaAIResearch/Illustrious-xl-early-release-v0
 ---
 <style>
+body {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100vh;
+  margin: 0;
+  font-family: Arial, sans-serif;
+  background-color: #f4f4f9;
+  overflow: auto;
+}
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 20px;
+}
+.title-container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: 1em;
+  border-radius: 10px;
+}
+.title {
+  font-size: 3em;
+  font-family: 'Montserrat', sans-serif;
+  text-align: center;
+  font-weight: bold;
+}
+.title span {
+  background: -webkit-linear-gradient(45deg, #FF9D3D, #AB886D, #CB80AB);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+.gallery {
+  display: grid;
+  grid-template-columns: repeat(5, 1fr);
+  gap: 10px;
+}
+.gallery img {
+  width: 100%;
+  height: auto;
+  margin-top: 0px;
+  margin-bottom: 0px;
+  border-radius: 10px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+  transition: transform 0.3s;
+}
+.gallery img:hover {
+  transform: scale(1.05);
+}
+.note {
+  font-size: 1em;
+  opacity: 50%;
+  text-align: center;
+  margin-top: 20px;
+  color: #555;
+}
 </style>
+<div class="container">
+  <div class="title-container">
+    <div class="title"><span>Raehoshi illust XL</span></div>
+  </div>
+  <div class="gallery">
+    <img src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/u94w5RRbjzMB6LlJ25sf2.png" alt="Image 1">
+    <img src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/dRCXo39menlp9bldksWgz.png" alt="Image 2">
+    <img src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/5jiVLJeNuW81rL36dOQqz.png" alt="Image 3">
+    <img src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/BTM_Hgb6cjmm8YC-UO2t4.png" alt="Image 4">
+    <img src="https://cdn-uploads.huggingface.co/production/uploads/64b24543eec33e27dc9a6eca/IYS-NJ5HhbEcW8LCEOMkW.png" alt="Image 5">
+  </div>
+</div>
 ## Overview
 Introducing **Raehoshi illust XL** , an enhanced iteration built upon the Illustrious XL v0.1 model. It aims to elevate the visual style by addressing some of the limitations in the original, such as oversaturation and artifact noise. While these issues are not entirely eliminated, noticeable improvements have been made, and further refinements will continue. The goal is to deliver a more polished, balanced output while staying true to the strengths of the base model.