diff --git a/ui/media/css/main.css b/ui/media/css/main.css
index 39b7b6e4..9a1f186f 100644
--- a/ui/media/css/main.css
+++ b/ui/media/css/main.css
@@ -729,15 +729,30 @@ div.img-preview img {
     margin-right: 6px;
     cursor: move;
 }
-.taskStatusLabel {
+/* Override conflicting css from imported library */
+.header-content > .drag-handle {
+    min-width: initial !important;
+}
+.taskLabel {
     font-size: 8pt;
     background:var(--background-color2);
     border: 1px solid rgb(61, 62, 66);
     padding: 2pt 4pt;
     border-radius: 2pt;
-    margin-right: 5pt;
     display: inline;
 }
+.taskStatusLabel {
+    margin-right: 5pt;
+}
+.multiNumberOfImages {
+    font-weight: bold;
+}
+.taskNumberOfImagesLabel {
+    min-width: 30px;
+    display: inline-block;
+    text-align: center;
+}
+
 .activeTaskLabel {
     background:rgb(0, 90, 30);
     border: 1px solid rgb(0, 75, 19);
diff --git a/ui/media/js/main.js b/ui/media/js/main.js
index 755bca2f..5e37591d 100644
--- a/ui/media/js/main.js
+++ b/ui/media/js/main.js
@@ -1204,7 +1204,8 @@ function createTask(task) {
     taskEntry.className = "imageTaskContainer"
     taskEntry.innerHTML = ` <div class="header-content panel collapsible active">
                                 <i class="drag-handle fa-solid fa-grip"></i>
-                                <div class="taskStatusLabel">Enqueued</div>
+                                <div class="taskLabel taskNumberOfImagesLabel ${task.numOutputsTotal > 1 ? 'multiNumberOfImages' : ''}">✕${task.numOutputsTotal}</div>
+                                <div class="taskLabel taskStatusLabel">Enqueued</div>
                                 <button class="secondaryButton stopTask"><i class="fa-solid fa-xmark"></i> Cancel</button>
                                 <button class="tertiaryButton useSettings"><i class="fa-solid fa-redo"></i> Use these settings</button>
                                 <div class="preview-prompt"></div>