diff --git a/src/theme/NotFound.js b/src/theme/NotFound.js
new file mode 100644
index 00000000..3659ea1c
--- /dev/null
+++ b/src/theme/NotFound.js
@@ -0,0 +1,46 @@
+import React, { useEffect } from 'react';
+import Translate, {translate} from '@docusaurus/Translate';
+import {PageMetadata} from '@docusaurus/theme-common';
+import Layout from '@theme/Layout';
+export default function NotFound() {
+
+  return (
+    <>
+      <PageMetadata
+        title={translate({
+          id: 'theme.NotFound.title',
+          message: 'Page Not Found',
+        })}
+      />
+      <Layout>
+        <main className="container margin-vert--xl">
+          <div className="row">
+            <div className="col col--6 col--offset-3">
+              <h1 className="hero__title">
+                <Translate
+                  id="theme.NotFound.title"
+                  description="The title of the 404 page">
+                  404 TITLE
+                </Translate>
+              </h1>
+              <p>
+                <Translate
+                  id="theme.NotFound.p1"
+                  description="The first paragraph of the 404 page">
+                  404 SUMMARY
+                </Translate>
+              </p>
+              <p>
+                <Translate
+                  id="theme.NotFound.p2"
+                  description="The 2nd paragraph of the 404 page">
+                  404 FURTHER INFO.
+                </Translate>
+              </p>
+            </div>
+          </div>
+        </main>
+      </Layout>
+    </>
+  );
+}