diff --git a/src/Router.tsx b/src/Router.tsx
index 8ab9f37..29d80c5 100644
--- a/src/Router.tsx
+++ b/src/Router.tsx
@@ -4,14 +4,14 @@ import BillsPage from './pages/bills';
 import HomePage from './pages/home';
 import NotFoundPage from './pages/notFound';
 
-type Config = {
+type RouteConfig = {
   path: string;
   component: ({ ...props }: any) => JSX.Element;
   exact?: boolean;
 };
 
 export default function Router() {
-  const routes: Config[] = [
+  const routes: RouteConfig[] = [
     {
       path: '/',
       component: HomePage,
diff --git a/src/assets/notFound/404.png b/src/assets/notFound/404.png
new file mode 100644
index 0000000..b0a2dff
Binary files /dev/null and b/src/assets/notFound/404.png differ
diff --git a/src/pages/notFound.tsx b/src/pages/notFound.tsx
index cc7613b..e1d9ae7 100644
--- a/src/pages/notFound.tsx
+++ b/src/pages/notFound.tsx
@@ -1,7 +1,22 @@
+import { Button, Col, Image, Row } from 'antd';
+import { useHistory } from 'react-router-dom';
+import NotFoundImage from '../assets/notFound/404.png';
 import { withLayout } from '../layouts/main';
 
 function NotFoundPage() {
-  return <div>Hoho</div>;
+  const history = useHistory();
+  return (
+    <Col>
+      <Row justify="center">
+        <Button size="large" type="link" onClick={() => history.push('/')}>
+          Go Back to Safety
+        </Button>
+      </Row>
+      <Row justify="center">
+        <Image src={NotFoundImage} preview={false} width={800} />
+      </Row>
+    </Col>
+  );
 }
 
 export default withLayout(NotFoundPage);