diff --git a/src/actions/index.ts b/src/actions/index.ts
index 88b5d62..5ceaf02 100644
--- a/src/actions/index.ts
+++ b/src/actions/index.ts
@@ -11,3 +11,9 @@ export async function editSnippet(id: number, code: string) {
 
   redirect(`/snippets/${id}`);
 }
+
+export async function deleteSnippet(id: number) {
+  await db.snippet.delete({ where: { id } });
+
+  redirect("/");
+}
diff --git a/src/app/snippets/[id]/page.tsx b/src/app/snippets/[id]/page.tsx
index 5b191f6..7f1495e 100644
--- a/src/app/snippets/[id]/page.tsx
+++ b/src/app/snippets/[id]/page.tsx
@@ -1,5 +1,6 @@
 import { db } from "@/db";
 import Link from "next/link";
+import * as actions from "@/actions";
 import { notFound } from "next/navigation";
 
 interface SnippetShowPageProps {
@@ -22,6 +23,8 @@ export default async function SnippetShowPage(props: SnippetShowPageProps) {
     return notFound();
   }
 
+  const deleteSnippetAction = actions.deleteSnippet.bind(null, snippet.id);
+
   return (
     <div>
       <div className="flex m-4 justify-between items-center">
@@ -33,7 +36,9 @@ export default async function SnippetShowPage(props: SnippetShowPageProps) {
           >
             Edit
           </Link>
-          <button className="p-2 border rounded">Delete</button>
+          <form action={deleteSnippetAction}>
+            <button className="p-2 border rounded">Delete</button>
+          </form>
         </div>
       </div>
       <pre className="p-3 border rounded bg-gray-200 border-gray-200">