diff --git a/package-lock.json b/package-lock.json
index 7c8dfb5..988c063 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,8 @@
       "name": "transcriptmaker",
       "version": "0.0.0",
       "dependencies": {
+        "file-saver": "^2.0.5",
+        "jspdf": "^2.5.1",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-speech-recognition": "^3.10.0",
@@ -18,9 +20,11 @@
         "@babel/core": "^7.23.2",
         "@babel/preset-env": "^7.23.2",
         "@babel/preset-react": "^7.22.15",
+        "@types/file-saver": "^2.0.7",
         "@types/react": "^18.2.15",
         "@types/react-dom": "^18.2.7",
         "@types/react-speech-recognition": "^3.9.3",
+        "@types/regenerator-runtime": "^0.13.5",
         "@typescript-eslint/eslint-plugin": "^6.0.0",
         "@typescript-eslint/parser": "^6.0.0",
         "@vitejs/plugin-react": "^4.0.3",
@@ -1877,7 +1881,6 @@
       "version": "7.23.2",
       "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.2.tgz",
       "integrity": "sha512-mM8eg4yl5D6i3lu2QKPuPH4FArvJ8KhTofbE7jwMUv9KX5mBvwPAqnV3MlyBNqdp9RyRKP6Yck8TrfYrPvX3bg==",
-      "dev": true,
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -2560,6 +2563,12 @@
       "dev": true,
       "peer": true
     },
+    "node_modules/@types/file-saver": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.7.tgz",
+      "integrity": "sha512-dNKVfHd/jk0SkR/exKGj2ggkB45MAkzvWCaqLUUgkyjITkGNzH8H+yUwr+BLJUBjZOe9w8X3wgmXhZDRg1ED6A==",
+      "dev": true
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.14",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.14.tgz",
@@ -2582,6 +2591,12 @@
       "integrity": "sha512-n1yyPsugYNSmHgxDFjicaI2+gCNjsBck8UX9kuofAKlc0h1bL+20oSF72KeNaW2DUlesbEVCFgyV2dPGTiY42g==",
       "dev": true
     },
+    "node_modules/@types/raf": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.3.tgz",
+      "integrity": "sha512-c4YAvMedbPZ5tEyxzQdMoOhhJ4RD3rngZIdwC2/qDN3d7JpEhB6fiBRKVY1lg5B7Wk+uPBjn5f39j1/2MY1oOw==",
+      "optional": true
+    },
     "node_modules/@types/react": {
       "version": "18.2.34",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.34.tgz",
@@ -2611,6 +2626,12 @@
         "@types/dom-speech-recognition": "*"
       }
     },
+    "node_modules/@types/regenerator-runtime": {
+      "version": "0.13.5",
+      "resolved": "https://registry.npmjs.org/@types/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz",
+      "integrity": "sha512-kuQTuRQB2RafkNk1qimK3zu4KSfy6z47diYGXVDcFcAZ3pVTR25CXiSb3adKry+onx2BBB9DBXxxLdbuglx5mw==",
+      "dev": true
+    },
     "node_modules/@types/scheduler": {
       "version": "0.16.5",
       "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.5.tgz",
@@ -3184,6 +3205,17 @@
       "integrity": "sha512-baNZyqaaLhyLVKm/DlvdW051MSgO6b8eVfIezl9E5PqWxFgzLm/wQntEW4zOytVburDEr0JlALEpdOFwvErLsg==",
       "dev": true
     },
+    "node_modules/atob": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
+      "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
+      "bin": {
+        "atob": "bin/atob.js"
+      },
+      "engines": {
+        "node": ">= 4.5.0"
+      }
+    },
     "node_modules/autoprefixer": {
       "version": "10.4.16",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
@@ -4279,6 +4311,15 @@
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true
     },
+    "node_modules/base64-arraybuffer": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
+      "integrity": "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==",
+      "optional": true,
+      "engines": {
+        "node": ">= 0.6.0"
+      }
+    },
     "node_modules/binary-extensions": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@@ -4342,6 +4383,17 @@
         "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
       }
     },
+    "node_modules/btoa": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/btoa/-/btoa-1.2.1.tgz",
+      "integrity": "sha512-SB4/MIGlsiVkMcHmT+pSmIPoNDoHg+7cMzmt3Uxt628MTz2487DKSqK/fuhFBrkuqrYv5UCEnACpF4dTFNKc/g==",
+      "bin": {
+        "btoa": "bin/btoa.js"
+      },
+      "engines": {
+        "node": ">= 0.4.0"
+      }
+    },
     "node_modules/buffer-from": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
@@ -4387,6 +4439,42 @@
         }
       ]
     },
+    "node_modules/canvg": {
+      "version": "3.0.10",
+      "resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.10.tgz",
+      "integrity": "sha512-qwR2FRNO9NlzTeKIPIKpnTY6fqwuYSequ8Ru8c0YkYU7U0oW+hLUvWadLvAu1Rl72OMNiFhoLu4f8eUjQ7l/+Q==",
+      "optional": true,
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "@types/raf": "^3.4.0",
+        "core-js": "^3.8.3",
+        "raf": "^3.4.1",
+        "regenerator-runtime": "^0.13.7",
+        "rgbcolor": "^1.0.1",
+        "stackblur-canvas": "^2.0.0",
+        "svg-pathdata": "^6.0.3"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
+    "node_modules/canvg/node_modules/core-js": {
+      "version": "3.36.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.36.1.tgz",
+      "integrity": "sha512-BTvUrwxVBezj5SZ3f10ImnX2oRByMxql3EimVqMysepbC9EeMUOpLwdy6Eoili2x6E4kf+ZUB5k/+Jv55alPfA==",
+      "hasInstallScript": true,
+      "optional": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/core-js"
+      }
+    },
+    "node_modules/canvg/node_modules/regenerator-runtime": {
+      "version": "0.13.11",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
+      "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==",
+      "optional": true
+    },
     "node_modules/chalk": {
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@@ -4541,6 +4629,15 @@
         "node": ">= 8"
       }
     },
+    "node_modules/css-line-break": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-2.1.0.tgz",
+      "integrity": "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==",
+      "optional": true,
+      "dependencies": {
+        "utrie": "^1.0.2"
+      }
+    },
     "node_modules/cssesc": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -4630,6 +4727,12 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/dompurify": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.5.0.tgz",
+      "integrity": "sha512-5RXhAXSCrKTqt9pSbobT9PVRX+oPpENplTZqCiK1l0ya+ZOzwo9kqsGLbYRsAhzIiLCwKEy99XKSSrqnRTLVcw==",
+      "optional": true
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.4.576",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.576.tgz",
@@ -5043,6 +5146,11 @@
         "reusify": "^1.0.4"
       }
     },
+    "node_modules/fflate": {
+      "version": "0.4.8",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.4.8.tgz",
+      "integrity": "sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA=="
+    },
     "node_modules/file-entry-cache": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz",
@@ -5055,6 +5163,11 @@
         "node": "^10.12.0 || >=12.0.0"
       }
     },
+    "node_modules/file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
+    },
     "node_modules/filename-reserved-regex": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/filename-reserved-regex/-/filename-reserved-regex-2.0.0.tgz",
@@ -5485,6 +5598,19 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/html2canvas": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.4.1.tgz",
+      "integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==",
+      "optional": true,
+      "dependencies": {
+        "css-line-break": "^2.1.0",
+        "text-segmentation": "^1.0.3"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
     "node_modules/ignore": {
       "version": "5.2.4",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz",
@@ -5753,6 +5879,34 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "node_modules/jspdf": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/jspdf/-/jspdf-2.5.1.tgz",
+      "integrity": "sha512-hXObxz7ZqoyhxET78+XR34Xu2qFGrJJ2I2bE5w4SM8eFaFEkW2xcGRVUss360fYelwRSid/jT078kbNvmoW0QA==",
+      "dependencies": {
+        "@babel/runtime": "^7.14.0",
+        "atob": "^2.1.2",
+        "btoa": "^1.2.1",
+        "fflate": "^0.4.8"
+      },
+      "optionalDependencies": {
+        "canvg": "^3.0.6",
+        "core-js": "^3.6.0",
+        "dompurify": "^2.2.0",
+        "html2canvas": "^1.0.0-rc.5"
+      }
+    },
+    "node_modules/jspdf/node_modules/core-js": {
+      "version": "3.36.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.36.1.tgz",
+      "integrity": "sha512-BTvUrwxVBezj5SZ3f10ImnX2oRByMxql3EimVqMysepbC9EeMUOpLwdy6Eoili2x6E4kf+ZUB5k/+Jv55alPfA==",
+      "hasInstallScript": true,
+      "optional": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/core-js"
+      }
+    },
     "node_modules/keyv": {
       "version": "4.5.4",
       "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
@@ -6189,6 +6343,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/performance-now": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
+      "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==",
+      "optional": true
+    },
     "node_modules/picocolors": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@@ -6521,6 +6681,15 @@
         }
       ]
     },
+    "node_modules/raf": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
+      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
+      "optional": true,
+      "dependencies": {
+        "performance-now": "^2.1.0"
+      }
+    },
     "node_modules/randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -6733,6 +6902,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/rgbcolor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/rgbcolor/-/rgbcolor-1.0.1.tgz",
+      "integrity": "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw==",
+      "optional": true,
+      "engines": {
+        "node": ">= 0.8.15"
+      }
+    },
     "node_modules/rimraf": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
@@ -6969,6 +7147,15 @@
         "source-map": "^0.5.6"
       }
     },
+    "node_modules/stackblur-canvas": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/stackblur-canvas/-/stackblur-canvas-2.7.0.tgz",
+      "integrity": "sha512-yf7OENo23AGJhBriGx0QivY5JP6Y1HbrrDI6WLt6C5auYZXlQrheoY8hD4ibekFKz1HOfE48Ww8kMWMnJD/zcQ==",
+      "optional": true,
+      "engines": {
+        "node": ">=0.1.14"
+      }
+    },
     "node_modules/strip-ansi": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
@@ -7071,6 +7258,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/svg-pathdata": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/svg-pathdata/-/svg-pathdata-6.0.3.tgz",
+      "integrity": "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw==",
+      "optional": true,
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
     "node_modules/tailwindcss": {
       "version": "3.3.5",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.5.tgz",
@@ -7219,6 +7415,15 @@
         "source-map": "^0.6.0"
       }
     },
+    "node_modules/text-segmentation": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/text-segmentation/-/text-segmentation-1.0.3.tgz",
+      "integrity": "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==",
+      "optional": true,
+      "dependencies": {
+        "utrie": "^1.0.2"
+      }
+    },
     "node_modules/text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@@ -7449,6 +7654,15 @@
       "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "dev": true
     },
+    "node_modules/utrie": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/utrie/-/utrie-1.0.2.tgz",
+      "integrity": "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==",
+      "optional": true,
+      "dependencies": {
+        "base64-arraybuffer": "^1.0.2"
+      }
+    },
     "node_modules/vite": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.0.tgz",
diff --git a/package.json b/package.json
index cd6b58c..ba12bd8 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "file-saver": "^2.0.5",
+    "jspdf": "^2.5.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-speech-recognition": "^3.10.0",
@@ -20,9 +22,11 @@
     "@babel/core": "^7.23.2",
     "@babel/preset-env": "^7.23.2",
     "@babel/preset-react": "^7.22.15",
+    "@types/file-saver": "^2.0.7",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
     "@types/react-speech-recognition": "^3.9.3",
+    "@types/regenerator-runtime": "^0.13.5",
     "@typescript-eslint/eslint-plugin": "^6.0.0",
     "@typescript-eslint/parser": "^6.0.0",
     "@vitejs/plugin-react": "^4.0.3",
diff --git a/src/components/SpeechTranscript.tsx b/src/components/SpeechTranscript.tsx
index b1f8e92..a44eb3a 100644
--- a/src/components/SpeechTranscript.tsx
+++ b/src/components/SpeechTranscript.tsx
@@ -2,20 +2,53 @@ import 'regenerator-runtime'
 import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition';
 import { useEffect, useRef, useState } from 'react';
 import useClipboard from 'react-use-clipboard';
+import jsPDF from 'jspdf';
+import { saveAs } from 'file-saver';
 
 const SpeechTranscript = () => {
-  const [textToCopy,setTextToCopy] = useState('');
-  const [,setCopied] = useClipboard(textToCopy);
+  const [textToCopy, setTextToCopy] = useState('');
+  const [isCopied, setCopied] = useClipboard(textToCopy);
+  const [showDropdown, setShowDropdown] = useState(false);
 
-  const listen = ()=>{
-   SpeechRecognition.startListening({continuous: true, language: 'en-IN'});
+  const toggleDropdown = () => {
+    setShowDropdown(!showDropdown);
+  };
+
+  const saveAsPdf = () => {
+    if (transcript) {
+      const pdf = new jsPDF();
+      pdf.setFontSize(12);
+      pdf.text(transcript, 15, 20);
+      pdf.save("transcript.pdf");
+    }
+    setShowDropdown(false);
+  };
+
+  const saveAsTxt = () => {
+    if (transcript) {
+      const blob = new Blob([transcript], { type: 'text/plain;charset=utf-8' });
+      saveAs(blob, "transcript.txt");
+    }
+    setShowDropdown(false);
+  };
+
+  const saveAsDoc = () => {
+    if (transcript) {
+      const blob = new Blob([transcript], { type: 'text/plain;charset=utf-8' });
+      saveAs(blob, "transcript.docs");
+    }
+    setShowDropdown(false);
+  };
+  
+  const listen = () => {
+    SpeechRecognition.startListening({ continuous: true, language: 'en-IN' });
   }
-  const stopListen = ()=> {
-   SpeechRecognition.stopListening();
+  const stopListen = () => {
+    SpeechRecognition.stopListening();
   }
-  
-  const {transcript, browserSupportsSpeechRecognition, resetTranscript} = useSpeechRecognition();
-  const transcriptContainerRef:any = useRef(null);
+
+  const { transcript, browserSupportsSpeechRecognition, resetTranscript } = useSpeechRecognition();
+  const transcriptContainerRef: any = useRef(null);
 
   useEffect(() => {
     if (transcriptContainerRef.current) {
@@ -23,45 +56,68 @@ const SpeechTranscript = () => {
     }
   }, [transcript]);
 
-  if(!browserSupportsSpeechRecognition){
-   return null
+  if (!browserSupportsSpeechRecognition) {
+    return null
   }
   return (
     <div className="flex flex-col gap-3">
-       <h5 className="mt-[10%] text-[#333] font-[600] text-[32px]">
+      <h5 className="mt-[10%] text-[#333] font-[600] text-[32px]">
         Speech To Text Converter
-       </h5>
-        <div
+      </h5>
+      <div
         className="py-[1%] px-[2%] ml-[22%] mr-[20%] rounded-sm border shadow-md h-[30%]"
         style={{ overflowY: 'scroll', maxHeight: '200px' }}
         ref={transcriptContainerRef}
-        onClick={()=>{setTextToCopy(transcript)}}
+        onClick={() => { setTextToCopy(transcript) }}
       >
         {transcript}
       </div>
-       <div className="flex flex-row justify-evenly ml-[20%] mr-[19%] mt-[5%]">
-         <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-3 font-[600] text-[14px] cursor-pointer"
+      <div className="flex flex-row justify-evenly ml-[20%] mr-[19%] mt-[5%]">
+        <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-3 font-[600] text-[14px] cursor-pointer"
           onClick={setCopied}
-         >
-            Copy To ClipBoard
-         </div>   
-         <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-3 font-[600] text-[14px] cursor-pointer" 
-            onClick={listen}
-         >
-            Start Speaking
-         </div>
-         <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-3 font-[600] text-[14px] cursor-pointer"
-           onClick={stopListen}
-         >
-            Stop Speaking
-         </div>
-         <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-7 font-[600] text-[14px] cursor-pointer" 
-            onClick={resetTranscript}
-         >
-            Reset
-         </div>
-       </div>
+        >
+          Copy To ClipBoard
+        </div>
+        <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-3 font-[600] text-[14px] cursor-pointer"
+          onClick={listen}
+        >
+          Start Speaking
+        </div>
+        <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-3 font-[600] text-[14px] cursor-pointer"
+          onClick={stopListen}
+        >
+          Stop Speaking
+        </div>
+        <div className="bg-[#5959dc] hover:bg-[#7272e0d8] text-[#fff] rounded-[8px] py-1 px-7 font-[600] text-[14px] cursor-pointer"
+          onClick={resetTranscript}
+        >
+          Reset
+        </div>
+
+        {/*  changes by vijay adding features save as pdf, docs, t */}
+
+        <div className="relative inline-block text-left">
+          <div>
+            <button type="button" onClick={toggleDropdown} className="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 focus:ring-offset-indigo-200" id="options-menu" aria-haspopup="true" aria-expanded="true">
+              Save As
+              <svg className="-mr-1 ml-2 h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+                <path fillRule="evenodd" d="M10 12a1 1 0 0 1-.707-.293l-4-4a1 1 0 1 1 1.414-1.414L10 10.586l3.293-3.293a1 1 0 0 1 1.414 1.414l-4 4a1 1 0 0 1-.707.293z" clipRule="evenodd" />
+              </svg>
+            </button>
+          </div>
+          {showDropdown && (
+            <div className="origin-top-right absolute right-0 mt-1 w-30 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">
+              <div className="py-1" role="none">
+                <button onClick={saveAsPdf} className="block px-2 py-1 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900" role="menuitem">PDF</button>
+                <button onClick={saveAsDoc} className="block px-2 py-1 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900" role="menuitem">DOC</button>
+                <button onClick={saveAsTxt} className="block px-2 py-1 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900" role="menuitem">TXT</button>
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
     </div>
+
   )
 }