diff --git a/css/main.css b/css/main.css
index 5c1c356d..4dea6b9e 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1752,3 +1752,42 @@ button#swap-height-width {
 .min.svelte-1yrv54 {
     min-height: 0;
 }
+
+/* Image Generation Progress Bar */
+#image-progress .image-ai-separator {
+    height: 24px;
+    margin: 20px 0;
+    border-top: 1px solid var(--input-border-color);
+}
+
+#image-progress .image-ai-progress-wrapper {
+    height: 24px;
+    margin: 20px 0;
+}
+
+#image-progress .image-ai-progress-track {
+    background: #e5e7eb;
+    border-radius: 4px;
+    overflow: hidden;
+    height: 8px;
+}
+
+.dark #image-progress .image-ai-progress-track {
+    background: #333;
+}
+
+#image-progress .image-ai-progress-fill {
+    background: #4a9eff;
+    height: 100%;
+}
+
+#image-progress .image-ai-progress-text {
+    text-align: center;
+    font-size: 12px;
+    color: #666;
+    margin-top: 4px;
+}
+
+.dark #image-progress .image-ai-progress-text {
+    color: #888;
+}
diff --git a/modules/ui_image_generation.py b/modules/ui_image_generation.py
index 62760a8a..e85f1520 100644
--- a/modules/ui_image_generation.py
+++ b/modules/ui_image_generation.py
@@ -667,13 +667,13 @@ def create_event_handlers():
 def progress_bar_html(progress=0, text=""):
     """Generate HTML for progress bar. Empty div when progress <= 0."""
     if progress <= 0:
-        return '<div style="height: 24px; margin: 20px 0; border-top: 1px solid #444;"></div>'
+        return '<div class="image-ai-separator"></div>'
 
-    return f'''<div style="height: 24px; margin: 20px 0;">
-        <div style="background: #333; border-radius: 4px; overflow: hidden; height: 8px;">
-            <div style="background: #4a9eff; height: 100%; width: {progress*100:.1f}%;"></div>
+    return f'''<div class="image-ai-progress-wrapper">
+        <div class="image-ai-progress-track">
+            <div class="image-ai-progress-fill" style="width: {progress*100:.1f}%;"></div>
         </div>
-        <div style="text-align: center; font-size: 11px; color: #888; margin-top: 4px;">{text}</div>
+        <div class="image-ai-progress-text">{text}</div>
     </div>'''