diff --git a/src/components/Controls/AttachImage.vue b/src/components/Controls/AttachImage.vue
index 2dbb84442..e35746da5 100644
--- a/src/components/Controls/AttachImage.vue
+++ b/src/components/Controls/AttachImage.vue
@@ -62,6 +62,14 @@ import { defineComponent, PropType } from 'vue';
 import FeatherIcon from '../FeatherIcon.vue';
 import Base from './Base.vue';
 
+const mime_types: Record<string,string> = {
+  'png': 'image/png',
+  'jpg': 'image/jpeg',
+  'jpeg': 'image/jpeg',
+  'webp': 'image/webp',
+  'svg': 'image/svg+xml'
+}
+
 export default defineComponent({
   name: 'AttachImage',
   components: { FeatherIcon },
@@ -100,7 +108,7 @@ export default defineComponent({
       const options = {
         title: fyo.t`Select Image`,
         filters: [
-          { name: 'Image', extensions: ['png', 'jpg', 'jpeg', 'webp'] },
+          { name: 'Image', extensions: Object.keys(mime_types) },
         ],
       };
 
@@ -110,7 +118,7 @@ export default defineComponent({
         return;
       }
       const extension = name.split('.').at(-1);
-      const type = 'image/' + extension;
+      const type = mime_types[extension];
       const dataURL = await getDataURL(type, data);
 
       // @ts-ignore