diff --git a/index.html b/index.html
index 0f2725a..5b9fde9 100644
--- a/index.html
+++ b/index.html
@@ -6,7 +6,7 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>redmine-api-administracion</title>
     </head>
-    <body data-bs-theme="dark">
+    <body data-bs-theme="light">
         <div id="app"></div>
         <script type="module" src="/src/main.ts"></script>
     </body>
diff --git a/src/App.svelte b/src/App.svelte
index 774f919..75e9190 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -33,9 +33,26 @@
         }
         setTimeout(() => {}, 100);
     }
+    async function exportAllToPNG(issues: any[]) {
+        issues.forEach(async (issue) => {
+            const element = document.getElementById(`card-${issue.id}`);
+
+            if (element) {
+                const canvas = await html2canvas(element);
+                const image = canvas.toDataURL("image/png");
+                const link = document.createElement("a");
+                link.download = `issue-${issue.id}.png`;
+                link.href = image;
+                link.click();
+            }
+        });
+    }
 </script>
 
 <main>
+    <button onclick={() => exportAllToPNG(issues)} class="btn btn-primary mt-3"
+        >Exportar a PNG</button
+    >
     {#if issues.length == 0}
         <p>Cargando...</p>
     {:else}
@@ -43,10 +60,12 @@
             {#each issues as issue}
                 <div class="m-2 w-75">
                     <Tarjeta {issue} />
+                    <!--
                     <button
                         onclick={() => exportToPNG(issue)}
                         class="btn btn-primary mt-3">Exportar a PNG</button
                     >
+                    -->
                 </div>
             {/each}
         </div>
