diff --git a/ApiCore-Frontend/src/app/(app)/error.tsx b/ApiCore-Frontend/src/app/(app)/error.tsx
new file mode 100644
index 0000000..6d45ed8
--- /dev/null
+++ b/ApiCore-Frontend/src/app/(app)/error.tsx
@@ -0,0 +1,42 @@
+"use client";
+
+import { useEffect } from "react";
+import { AlertTriangle } from "lucide-react";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+
+export default function AppError({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  useEffect(() => {
+    console.error(error);
+  }, [error]);
+
+  return (
+    <main className="flex flex-col gap-4 p-4 sm:p-6">
+      <Card className="max-w-lg">
+        <CardHeader>
+          <div className="flex items-center gap-2.5">
+            <span className="flex size-9 items-center justify-center rounded-xl bg-destructive/10 text-destructive">
+              <AlertTriangle className="size-5" />
+            </span>
+            <CardTitle className="text-lg">Etwas ist schiefgelaufen</CardTitle>
+          </div>
+        </CardHeader>
+        <CardContent className="flex flex-col gap-4">
+          <p className="text-sm text-muted-foreground">
+            Diese Seite konnte nicht angezeigt werden. Bereits gespeicherte Daten sind davon nicht
+            betroffen. Über die Navigation kommst du zu jeder anderen Seite.
+          </p>
+          <Button onClick={() => reset()} className="w-fit">
+            Erneut versuchen
+          </Button>
+        </CardContent>
+      </Card>
+    </main>
+  );
+}
diff --git a/ApiCore-Frontend/src/app/error.tsx b/ApiCore-Frontend/src/app/error.tsx
new file mode 100644
index 0000000..53b876d
--- /dev/null
+++ b/ApiCore-Frontend/src/app/error.tsx
@@ -0,0 +1,48 @@
+"use client";
+
+import { useEffect } from "react";
+import { AlertTriangle } from "lucide-react";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { HoneycombPattern } from "@/components/honeycomb-pattern";
+
+export default function RootError({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  useEffect(() => {
+    console.error(error);
+  }, [error]);
+
+  return (
+    <main className="relative flex min-h-screen items-center justify-center overflow-hidden bg-background p-4">
+      <HoneycombPattern />
+      <Card className="relative w-full max-w-md shadow-[var(--shadow-elevated)]">
+        <CardHeader>
+          <div className="flex items-center gap-2.5">
+            <span className="flex size-9 items-center justify-center rounded-xl bg-destructive/10 text-destructive">
+              <AlertTriangle className="size-5" />
+            </span>
+            <CardTitle className="text-lg">Etwas ist schiefgelaufen</CardTitle>
+          </div>
+        </CardHeader>
+        <CardContent className="flex flex-col gap-4">
+          <p className="text-sm text-muted-foreground">
+            Es ist ein unerwarteter Fehler aufgetreten. Bereits gespeicherte Daten sind davon nicht
+            betroffen.
+          </p>
+          <div className="flex flex-wrap gap-2">
+            <Button onClick={() => reset()}>Erneut versuchen</Button>
+            {/* Plain reload, not client-side navigation - a crash here may
+                have left the app's client state corrupted, so this must
+                guarantee a fully clean slate rather than route through it. */}
+            <Button variant="outline" render={<a href="/dashboard">Zum Dashboard</a>} />
+          </div>
+        </CardContent>
+      </Card>
+    </main>
+  );
+}