diff --git a/website/src/components/button.js b/website/src/components/button.js
index 5e03ca312..410193a7e 100644
--- a/website/src/components/button.js
+++ b/website/src/components/button.js
@@ -27,7 +27,7 @@ Button.defaultProps = {
 }
 
 Button.propTypes = {
-    to: PropTypes.string.isRequired,
+    to: PropTypes.string,
     variant: PropTypes.oneOf(['primary', 'secondary', 'tertiary']),
     large: PropTypes.bool,
     icon: PropTypes.string,
diff --git a/website/src/pages/404.js b/website/src/pages/404.js
new file mode 100644
index 000000000..a25e8f553
--- /dev/null
+++ b/website/src/pages/404.js
@@ -0,0 +1,47 @@
+import React from 'react'
+import { window } from 'browser-monads'
+import { graphql } from 'gatsby'
+
+import Template from '../templates/index'
+import { LandingHeader, LandingTitle } from '../components/landing'
+import Button from '../components/button'
+
+export default ({ data, location }) => {
+    const { nightly } = data.site.siteMetadata
+    const pageContext = { title: '404 Error', searchExclude: true, isIndex: false }
+    return (
+        <Template data={data} pageContext={pageContext} location={location}>
+            <LandingHeader style={{ minHeight: 400 }} nightly={nightly}>
+                <LandingTitle>
+                    Ooops, this page
+                    <br />
+                    does not exist!
+                </LandingTitle>
+                <br />
+                <Button onClick={() => window.history.go(-1)} variant="tertiary">
+                    Click here to go back
+                </Button>
+            </LandingHeader>
+        </Template>
+    )
+}
+
+export const pageQuery = graphql`
+    query {
+        site {
+            siteMetadata {
+                nightly
+                title
+                description
+                navigation {
+                    text
+                    url
+                }
+                docSearch {
+                    apiKey
+                    indexName
+                }
+            }
+        }
+    }
+`
diff --git a/website/src/pages/404.md b/website/src/pages/404.md
deleted file mode 100644
index 910b552b3..000000000
--- a/website/src/pages/404.md
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: 404 Error
----
-
-import Error from 'widgets/404.js'
-
-<Error />
diff --git a/website/src/widgets/404.js b/website/src/widgets/404.js
deleted file mode 100644
index bc65e9f0d..000000000
--- a/website/src/widgets/404.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from 'react'
-import { window } from 'browser-monads'
-
-import { LandingHeader, LandingTitle } from '../components/landing'
-import Button from '../components/button'
-
-export default () => (
-    <LandingHeader style={{ minHeight: 400 }}>
-        <LandingTitle>
-            Ooops, this page
-            <br />
-            does not exist!
-        </LandingTitle>
-        <br />
-        <Button onClick={() => window.history.go(-1)} variant="tertiary">
-            Click here to go back
-        </Button>
-    </LandingHeader>
-)