diff --git a/src/pages/PageNotFound.jsx b/src/pages/PageNotFound.jsx
new file mode 100644
index 0000000..c7e4685
--- /dev/null
+++ b/src/pages/PageNotFound.jsx
@@ -0,0 +1,22 @@
+import React from "react";
+import AnimatedPage from "../components/AnimatedPage";
+import Nav from "../components/ui/Nav";
+import { useUser } from "../hooks/useUser";
+
+export default function PageNotFound() {
+	const { screensTranslations } = useUser();
+
+	if (!screensTranslations || !screensTranslations.screen_404) return <p>loading</p>;
+	const screen404Translations = screensTranslations.screen_404;
+
+	return (
+		<AnimatedPage className='page-container page-container--not-found  '>
+			<div className='content-page'>
+				<Nav />
+				<h1>{screen404Translations.error}</h1>
+				<h2>{screen404Translations.page_not_found}</h2>
+				<p>{screen404Translations.explanation}</p>
+			</div>
+		</AnimatedPage>
+	);
+}