diff --git a/memos_prod.db-shm b/memos_prod.db-shm
index ad56e3d15..62d7f1546 100644
Binary files a/memos_prod.db-shm and b/memos_prod.db-shm differ
diff --git a/memos_prod.db-wal b/memos_prod.db-wal
index 63af6c026..09ff88a2f 100644
Binary files a/memos_prod.db-wal and b/memos_prod.db-wal differ
diff --git a/web/src/components/MemoView/MemoView.tsx b/web/src/components/MemoView/MemoView.tsx
index 210e3484d..9d3c37ba5 100644
--- a/web/src/components/MemoView/MemoView.tsx
+++ b/web/src/components/MemoView/MemoView.tsx
@@ -16,6 +16,7 @@ import { MEMO_CARD_BASE_CLASSES } from "./constants";
 import { useImagePreview } from "./hooks";
 import { computeCommentAmount, MemoViewContext } from "./MemoViewContext";
 import type { MemoViewProps } from "./types";
+import MemoFooter from "./components/MemoFooter";
 
 const MemoView: React.FC<MemoViewProps> = (props: MemoViewProps) => {
 <<<<<<< HEAD
@@ -181,7 +182,7 @@ const MemoView: React.FC<MemoViewProps> = (props: MemoViewProps) => {
 >>>>>>> 89d43a2e (Developed Color Picker Feature for memos)
 
       <MemoBody compact={compact} />
-
+      <MemoFooter/>
       <PreviewImageDialog
         open={previewState.open}
         onOpenChange={setPreviewOpen}
diff --git a/web/src/components/MemoView/components/MemoCompleteList.tsx b/web/src/components/MemoView/components/MemoCompleteList.tsx
new file mode 100644
index 000000000..07509df47
--- /dev/null
+++ b/web/src/components/MemoView/components/MemoCompleteList.tsx
@@ -0,0 +1,19 @@
+import { Button } from "@/components/ui/button";
+import { Switch } from "@/components/ui/switch";
+
+function MemoCompleteList() {
+  return (
+    <section className="  flex items-center gap-3">
+        <div className=" flex items-center gap-2 ">
+            <span>Completed Task</span>
+        <Switch
+         defaultChecked
+         className="  [&>[data-slot=switch-thumb][data-state=unchecked]]:bg-mauve-400 [&>[data-slot=switch-thumb][data-state=checked]]:bg-white"
+         />
+         </div>
+        <Button  className=" not-hover:border-foreground not-hover:text-foreground bg-transparent border-2 transition-all ease-linear">Clear Completed</Button>
+    </section>
+  )
+}
+
+export default MemoCompleteList
\ No newline at end of file
diff --git a/web/src/components/MemoView/components/MemoFooter.tsx b/web/src/components/MemoView/components/MemoFooter.tsx
new file mode 100644
index 000000000..b42b3e079
--- /dev/null
+++ b/web/src/components/MemoView/components/MemoFooter.tsx
@@ -0,0 +1,11 @@
+import MemoCompleteList from "./MemoCompleteList";
+
+function MemoFooter() {
+  return (
+<footer className=" w-full  mt-5 flex justify-end items-center">
+    <MemoCompleteList/>
+</footer>
+  );
+}
+
+export default MemoFooter;
\ No newline at end of file