diff --git a/frontend/src/components/editor/output/ImageOutput.tsx b/frontend/src/components/editor/output/ImageOutput.tsx
index 7da669b6ef2..896af23c83f 100644
--- a/frontend/src/components/editor/output/ImageOutput.tsx
+++ b/frontend/src/components/editor/output/ImageOutput.tsx
@@ -5,8 +5,8 @@ import type { JSX } from "react";
 interface Props {
   src: string;
   alt?: string;
-  width?: number;
-  height?: number;
+  width?: number | string;
+  height?: number | string;
   className?: string;
 }
 
@@ -17,9 +17,18 @@ export const ImageOutput = ({
   height,
   className,
 }: Props): JSX.Element => {
+  // Convert numeric values to pixel strings, pass string values (like "100%") as-is
+  const style: React.CSSProperties = {};
+  if (width !== undefined) {
+    style.width = typeof width === "number" ? `${width}px` : width;
+  }
+  if (height !== undefined) {
+    style.height = typeof height === "number" ? `${height}px` : height;
+  }
+
   return (
     <span className={className}>
-      <img src={src} alt={alt} width={width} height={height} />
+      <img src={src} alt={alt} style={style} />
     </span>
   );
 };