diff --git a/src/pages/error/index.module.less b/src/pages/error/index.module.less
index e69de29..6e35a80 100644
--- a/src/pages/error/index.module.less
+++ b/src/pages/error/index.module.less
@@ -0,0 +1,4 @@
+.main {
+  width: 100vw;
+  height: 100vh;
+}
diff --git a/src/pages/error/index.tsx b/src/pages/error/index.tsx
index e05a98f..3ab4378 100644
--- a/src/pages/error/index.tsx
+++ b/src/pages/error/index.tsx
@@ -1,11 +1,27 @@
+import { Button, Result } from "antd";
 import React from "react";
+import { useNavigate } from "react-router-dom";
 import styles from "./index.module.less";
 
 export const ErrorPage: React.FC<any> = () => {
+  const navigate = useNavigate();
+
   return (
-    <div id="error-page">
-      <h1>Oops!</h1>
-      <p>路由不存在</p>
-    </div>
+    <Result
+      status="404"
+      title="404"
+      subTitle="您访问的页面不存在"
+      className={styles["main"]}
+      extra={
+        <Button
+          type="primary"
+          onClick={() => {
+            navigate("/");
+          }}
+        >
+          返回首页
+        </Button>
+      }
+    />
   );
 };