diff --git a/src/pages/404.tsx b/src/pages/404.tsx
index 4765f06..c06381b 100644
--- a/src/pages/404.tsx
+++ b/src/pages/404.tsx
@@ -1,9 +1,21 @@
-import React from "react";
+import CustomLink from "@/common/link";
+import { Flex, Center, Heading, Text, Button } from "@chakra-ui/react";
+import { House } from "phosphor-react";
 
-type Props = {};
-
-const Error = (props: Props) => {
-  return <div>Error 404</div>;
+const Error = () => {
+  return (
+    <>
+      <Center>
+        <Flex direction="column" justifyContent="center" alignItems="center">
+          <Heading mb="2">Error 404</Heading>
+          <Text mb="3">The page you are trying to access does not exist.</Text>
+          <CustomLink href="/">
+              <Text fontFamily="Inter-Semibold">Go home</Text>
+          </CustomLink>
+        </Flex>
+      </Center>
+    </>
+  );
 };
 
 export default Error;