diff --git a/package.json b/package.json
index fc55917d..ae96728c 100644
--- a/package.json
+++ b/package.json
@@ -52,6 +52,7 @@
     "jsonrepair": "3.8.0",
     "material-ui-popup-state": "5.3.1",
     "mui-nested-menu": "3.4.0",
+    "notistack": "^3.0.1",
     "p-limit": "6.1.0",
     "react": "18.3.1",
     "react-beautiful-dnd": "13.1.1",
diff --git a/src/components/context/AppContext.tsx b/src/components/context/AppContext.tsx
index 59d2c84b..db2adacb 100644
--- a/src/components/context/AppContext.tsx
+++ b/src/components/context/AppContext.tsx
@@ -16,6 +16,7 @@ import { CacheProvider, EmotionCache } from '@emotion/react';
 import createCache from '@emotion/cache';
 import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
+import { SnackbarProvider } from 'notistack';
 import { createAndSetTheme } from '@/theme';
 import { useLocalStorage } from '@/util/useStorage.tsx';
 import { ThemeMode, ThemeModeContext } from '@/components/context/ThemeModeContext.tsx';
@@ -101,7 +102,7 @@ export const AppContext: React.FC<Props> = ({ children }) => {
                                 <LibraryOptionsContextProvider>
                                     <NavBarContextProvider>
                                         <ActiveDevice.Provider value={activeDeviceContext}>
-                                            {children}
+                                            <SnackbarProvider>{children}</SnackbarProvider>
                                         </ActiveDevice.Provider>
                                     </NavBarContextProvider>
                                 </LibraryOptionsContextProvider>
diff --git a/src/components/util/Toast.tsx b/src/components/util/Toast.tsx
index 1735a302..1206ba80 100644
--- a/src/components/util/Toast.tsx
+++ b/src/components/util/Toast.tsx
@@ -6,69 +6,14 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
-import Slide, { SlideProps } from '@mui/material/Slide';
-import Snackbar from '@mui/material/Snackbar';
-import MuiAlert, { AlertColor as Severity } from '@mui/material/Alert';
-import { createRoot, Root } from 'react-dom/client';
+import { enqueueSnackbar, OptionsObject, SnackbarKey } from 'notistack';
 
-function removeToast(root: Root) {
-    root.unmount();
-}
-
-function Transition(props: SlideProps) {
-    return <Slide {...props} direction="up" />;
-}
-
-interface IToastProps {
-    message: string;
-    severity: Severity;
-}
-
-export function Toast(props: IToastProps) {
-    const { message, severity } = props;
-    const [open, setOpen] = React.useState(true);
-
-    const handleClose = () => {
-        setOpen(false);
-    };
-
-    return (
-        <Snackbar
-            open={open}
-            onClose={handleClose}
-            autoHideDuration={3000}
-            TransitionComponent={Transition}
-            message="I love snacks"
-        >
-            <MuiAlert elevation={6} variant="filled" onClose={handleClose} severity={severity}>
-                {message}
-            </MuiAlert>
-        </Snackbar>
-    );
-}
-
-export function makeToast(message: string, severity: Severity) {
-    const id = Math.floor(Math.random() * 1000);
-    const container = document.createElement('div');
-    container.id = `alert-${id}`;
-
-    document.body.appendChild(container);
-
-    const root = createRoot(container!);
-    root.render(<Toast message={message} severity={severity} />);
-
-    setTimeout(() => removeToast(root), 3500);
-}
-
-export function makeToaster([toasts, setToasts]: [React.ReactElement[], (arg0: React.ReactElement[]) => void]): [
-    React.ReactElement[],
-    (message: string, severity: Severity) => void,
-] {
-    return [
-        toasts,
-        (message: string, severity: Severity) => {
-            setToasts([<Toast key={Math.floor(Math.random() * 1000) + 1} message={message} severity={severity} />]);
-        },
-    ];
+export function makeToast(message: string, severity?: OptionsObject['variant']): SnackbarKey;
+export function makeToast(message: string, options?: OptionsObject): SnackbarKey;
+export function makeToast(message: string, options: OptionsObject['variant'] | OptionsObject = 'default'): SnackbarKey {
+    if (typeof options === 'string') {
+        return enqueueSnackbar(message, { variant: options });
+    }
+
+    return enqueueSnackbar(message, options);
 }
diff --git a/src/screens/settings/appearance/theme/ThemePreview.tsx b/src/screens/settings/appearance/theme/ThemePreview.tsx
index 50120dde..424f956f 100644
--- a/src/screens/settings/appearance/theme/ThemePreview.tsx
+++ b/src/screens/settings/appearance/theme/ThemePreview.tsx
@@ -24,7 +24,7 @@ import { ThemeModeContext } from '@/components/context/ThemeModeContext.tsx';
 import { AppTheme, loadThemeFonts } from '@/lib/ui/AppThemes.ts';
 import { createTheme } from '@/theme.ts';
 import { ThemeCreationDialog } from '@/screens/settings/appearance/theme/CreateThemeDialog.tsx';
-import { makeToast } from '@/components/util/Toast.tsx';
+import { makeToast } from '@/components/util/Toast';
 
 const ThemePreviewBadge = styled(Box)(() => ({
     width: '15px',
diff --git a/yarn.lock b/yarn.lock
index 6bedebd5..bc9cd851 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3998,6 +3998,11 @@ clone@^1.0.2:
   resolved "https://registry.yarnpkg.com/clone/-/clone-1.0.4.tgz#da309cc263df15994c688ca902179ca3c7cd7c7e"
   integrity sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==
 
+clsx@^1.1.0:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12"
+  integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==
+
 clsx@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.1.1.tgz#eed397c9fd8bd882bfb18deab7102049a2f32999"
@@ -5174,6 +5179,11 @@ globrex@^0.1.2:
   resolved "https://registry.yarnpkg.com/globrex/-/globrex-0.1.2.tgz#dd5d9ec826232730cd6793a5e33a9302985e6098"
   integrity sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==
 
+goober@^2.0.33:
+  version "2.1.14"
+  resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.14.tgz#4a5c94fc34dc086a8e6035360ae1800005135acd"
+  integrity sha512-4UpC0NdGyAFqLNPnhCT2iHpza2q+RAY3GV85a/mRPdzyPQMsj0KmMMuetdIkzWRbJ+Hgau1EZztq8ImmiMGhsg==
+
 gopd@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c"
@@ -6236,6 +6246,14 @@ normalize-path@^2.1.1:
   dependencies:
     remove-trailing-separator "^1.0.1"
 
+notistack@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/notistack/-/notistack-3.0.1.tgz#daf59888ab7e2c30a1fa8f71f9cba2978773236e"
+  integrity sha512-ntVZXXgSQH5WYfyU+3HfcXuKaapzAJ8fBLQ/G618rn3yvSzEbnOB8ZSOwhX+dAORy/lw+GC2N061JA0+gYWTVA==
+  dependencies:
+    clsx "^1.1.0"
+    goober "^2.0.33"
+
 npm-run-path@^5.1.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-5.3.0.tgz#e23353d0ebb9317f174e93417e4a4d82d0249e9f"