diff --git a/src/ts/image.ts b/src/ts/image.ts
index fdfa0a59..713a1257 100644
--- a/src/ts/image.ts
+++ b/src/ts/image.ts
@@ -3,6 +3,7 @@ import { selectSingleFile } from "./util";
 import { v4 } from "uuid";
 import { DataBase } from "./storage/database";
 import { get } from "svelte/store";
+import { isAPNG } from "./parser";
 
 const inlayStorage = localforage.createInstance({
     name: 'inlay',
@@ -98,7 +99,9 @@ export function supportsInlayImage(){
 }
 
 export async function reencodeImage(img:Uint8Array){
-
+    if(isAPNG(img)){
+        return img
+    }
     const canvas = document.createElement('canvas')
     const imgObj = new Image()
     imgObj.src = URL.createObjectURL(new Blob([img], {type: `image/png`}))
diff --git a/src/ts/parser.ts b/src/ts/parser.ts
index 2f2f4cf0..5f5552f9 100644
--- a/src/ts/parser.ts
+++ b/src/ts/parser.ts
@@ -305,7 +305,7 @@ async function resizeAndConvert(imageData: Uint8Array): Promise<Buffer> {
 
 type ImageType = 'JPEG' | 'PNG' | 'GIF' | 'BMP' | 'AVIF' | 'WEBP' | 'Unknown';
 
-function checkImageType(arr:Uint8Array):ImageType {
+export function checkImageType(arr:Uint8Array):ImageType {
     const isJPEG = arr[0] === 0xFF && arr[1] === 0xD8 && arr[arr.length-2] === 0xFF && arr[arr.length-1] === 0xD9;
     const isPNG = arr[0] === 0x89 && arr[1] === 0x50 && arr[2] === 0x4E && arr[3] === 0x47 && arr[4] === 0x0D && arr[5] === 0x0A && arr[6] === 0x1A && arr[7] === 0x0A;
     const isGIF = arr[0] === 0x47 && arr[1] === 0x49 && arr[2] === 0x46 && arr[3] === 0x38 && (arr[4] === 0x37 || arr[4] === 0x39) && arr[5] === 0x61;
@@ -322,7 +322,7 @@ function checkImageType(arr:Uint8Array):ImageType {
     return "Unknown";
 }
 
-function isAPNG(pngData: Uint8Array): boolean {
+export function isAPNG(pngData: Uint8Array): boolean {
     const pngSignature = [0x89, 0x50, 0x4E, 0x47, 0x0D, 0x0A, 0x1A, 0x0A];
     const acTL = [0x61, 0x63, 0x54, 0x4C];