diff --git a/extension/data/components/TextFeedbackContainer.tsx b/extension/data/components/TextFeedbackContainer.tsx
index f8ae4e9d9..8e6094ef8 100644
--- a/extension/data/components/TextFeedbackContainer.tsx
+++ b/extension/data/components/TextFeedbackContainer.tsx
@@ -1,3 +1,4 @@
+import {AnimatePresence, motion} from 'framer-motion';
 import {useSelector} from 'react-redux';
 import {RootState} from '../store';
 import {TextFeedbackLocation} from '../store/textFeedbackSlice';
@@ -20,12 +21,18 @@ export function TextFeedbackContainer () {
         } as const;
 
     return (
-        <>
+        <AnimatePresence>
             {currentMessage && (
-                <div id='tb-feedback-window' className={currentMessage.kind} style={style}>
+                <motion.div
+                    id='tb-feedback-window'
+                    className={currentMessage.kind}
+                    style={style}
+                    animate={{opacity: 1}}
+                    exit={{opacity: 0}}
+                >
                     <span className='tb-feedback-text'>{currentMessage.message}</span>
-                </div>
+                </motion.div>
             )}
-        </>
+        </AnimatePresence>
     );
 }
diff --git a/package-lock.json b/package-lock.json
index 549ef69a2..25d1c54f2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,6 +10,7 @@
                 "@reduxjs/toolkit": "^2.1.0",
                 "codemirror": "^5.65.15",
                 "dompurify": "^3.0.5",
+                "framer-motion": "^11.0.3",
                 "iter-ops": "^3.1.1",
                 "jquery": "^3.7.1",
                 "pako": "^0.2.6",
@@ -323,6 +324,21 @@
                 "win32"
             ]
         },
+        "node_modules/@emotion/is-prop-valid": {
+            "version": "0.8.8",
+            "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
+            "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
+            "optional": true,
+            "dependencies": {
+                "@emotion/memoize": "0.7.4"
+            }
+        },
+        "node_modules/@emotion/memoize": {
+            "version": "0.7.4",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
+            "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==",
+            "optional": true
+        },
         "node_modules/@eslint-community/eslint-utils": {
             "version": "4.4.0",
             "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
@@ -2250,6 +2266,29 @@
                 "is-callable": "^1.1.3"
             }
         },
+        "node_modules/framer-motion": {
+            "version": "11.0.3",
+            "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.0.3.tgz",
+            "integrity": "sha512-6x2poQpIWBdbZwLd73w6cKZ1I9IEPIU94C6/Swp1Zt3LJ+sB5bPe1E2wC6EH5hSISXNkMJ4afH7AdwS7MrtkWw==",
+            "dependencies": {
+                "tslib": "^2.4.0"
+            },
+            "optionalDependencies": {
+                "@emotion/is-prop-valid": "^0.8.2"
+            },
+            "peerDependencies": {
+                "react": "^18.0.0",
+                "react-dom": "^18.0.0"
+            },
+            "peerDependenciesMeta": {
+                "react": {
+                    "optional": true
+                },
+                "react-dom": {
+                    "optional": true
+                }
+            }
+        },
         "node_modules/fs-extra": {
             "version": "8.1.0",
             "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz",
@@ -4918,8 +4957,7 @@
         "node_modules/tslib": {
             "version": "2.6.2",
             "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-            "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==",
-            "dev": true
+            "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
         },
         "node_modules/type-check": {
             "version": "0.4.0",
@@ -5449,6 +5487,21 @@
             "dev": true,
             "optional": true
         },
+        "@emotion/is-prop-valid": {
+            "version": "0.8.8",
+            "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
+            "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
+            "optional": true,
+            "requires": {
+                "@emotion/memoize": "0.7.4"
+            }
+        },
+        "@emotion/memoize": {
+            "version": "0.7.4",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
+            "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==",
+            "optional": true
+        },
         "@eslint-community/eslint-utils": {
             "version": "4.4.0",
             "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
@@ -6885,6 +6938,15 @@
                 "is-callable": "^1.1.3"
             }
         },
+        "framer-motion": {
+            "version": "11.0.3",
+            "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.0.3.tgz",
+            "integrity": "sha512-6x2poQpIWBdbZwLd73w6cKZ1I9IEPIU94C6/Swp1Zt3LJ+sB5bPe1E2wC6EH5hSISXNkMJ4afH7AdwS7MrtkWw==",
+            "requires": {
+                "@emotion/is-prop-valid": "^0.8.2",
+                "tslib": "^2.4.0"
+            }
+        },
         "fs-extra": {
             "version": "8.1.0",
             "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz",
@@ -8787,8 +8849,7 @@
         "tslib": {
             "version": "2.6.2",
             "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-            "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==",
-            "dev": true
+            "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
         },
         "type-check": {
             "version": "0.4.0",
diff --git a/package.json b/package.json
index 1793f8e33..40047003d 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
         "@reduxjs/toolkit": "^2.1.0",
         "codemirror": "^5.65.15",
         "dompurify": "^3.0.5",
+        "framer-motion": "^11.0.3",
         "iter-ops": "^3.1.1",
         "jquery": "^3.7.1",
         "pako": "^0.2.6",