diff --git a/src/components/MobileNotice.tsx b/src/components/MobileNotice.tsx
new file mode 100644
index 0000000..c631d13
--- /dev/null
+++ b/src/components/MobileNotice.tsx
@@ -0,0 +1,34 @@
+import { useEffect, useState } from "react";
+import { SmartphoneIcon } from "lucide-react";
+
+import { Button } from "@/components/ui/button";
+import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
+
+function MobileNotice() {
+ const [isOpen, setIsOpen] = useState(false);
+
+ useEffect(() => {
+ setIsOpen(window.innerWidth <= 600);
+ }, []);
+
+ return (
+
+ );
+}
+
+export default MobileNotice;
diff --git a/src/pages/AppPage.tsx b/src/pages/AppPage.tsx
index a897066..cb8a0f8 100644
--- a/src/pages/AppPage.tsx
+++ b/src/pages/AppPage.tsx
@@ -5,6 +5,7 @@ import { SettingsProvider } from "@/context/Settings";
import { TexturesProvider } from "@/context/Textures";
import { ToolProvider } from "@/context/Tool";
+import MobileNotice from "@/components/MobileNotice";
import Menubar from "@/components/menubar";
import Toolbar from "@/components/toolbar";
import Canvas from "@/components/canvas/Canvas";
@@ -18,6 +19,8 @@ function AppPage() {
+
+