diff --git a/components/fsxa/Page404.tsx b/components/fsxa/Page404.tsx
new file mode 100644
index 0000000..c2e95ae
--- /dev/null
+++ b/components/fsxa/Page404.tsx
@@ -0,0 +1,21 @@
+import { FSXABaseComponent } from 'fsxa-pattern-library'
+import { Component } from 'vue-property-decorator'
+
+@Component({ name: 'Page404' })
+class Page404 extends FSXABaseComponent {
+  render() {
+    return (
+      <div class="h-full w-full flex items-center justify-center">
+        <div>
+          <div class="ui-block ui-text-center ui-uppercase ui-mt-6 ui-leading-10">
+            404 Error
+          </div>
+          <div class="ui-block ui-text-center ui-text-4xl ui-font-bold ui-mb-6 ui-leading-10">
+            Page not found.
+          </div>
+        </div>
+      </div>
+    )
+  }
+}
+export default Page404
diff --git a/docs/modules/ROOT/pages/Configuration.adoc b/docs/modules/ROOT/pages/Configuration.adoc
index 1233cc8..2645fa4 100644
--- a/docs/modules/ROOT/pages/Configuration.adoc
+++ b/docs/modules/ROOT/pages/Configuration.adoc
@@ -152,6 +152,14 @@ ________________________________________________________________________________
 
 *Default*: `undefined`
 
+==== 404 Page
+
+`components.page404` _optional_
+
+You can provide a component that will be used when no matching route could be found.
+
+*Default*: `undefined`
+
 ==== CustomRoutes
 
 `customRoutes` _optional_
diff --git a/fsxa.config.ts b/fsxa.config.ts
index e18bf6c..d9697cb 100644
--- a/fsxa.config.ts
+++ b/fsxa.config.ts
@@ -6,7 +6,8 @@ export default {
     layouts: '~/components/fsxa/layouts',
     richtext: '~/components/fsxa/richtext',
     appLayout: '~/components/fsxa/AppLayout',
-    loader: '~/components/fsxa/Loader'
+    loader: '~/components/fsxa/Loader',
+    page404: '~/components/fsxa/Page404'
   },
   customRoutes: '~/customRoutes'
 }