diff --git a/pages/_document.js b/pages/_document.js
new file mode 100644
index 0000000..e225dbd
--- /dev/null
+++ b/pages/_document.js
@@ -0,0 +1,57 @@
+import Doc, { Html, Head, Main, NextScript } from 'next/document';
+import { ThemeProvider } from 'theme-ui';
+
+const theme = {
+    config: {
+        useColorSchemeMediaQuery: true,
+        initialColorModeName: 'light',
+    },
+    colors: {
+        text: '#424242',
+        background: '#ffffff',
+        primary: '#6576CC',
+        cardText: '#ffffff',
+        cardBackground: 'rgba(255, 255, 255, 0.65)',
+        cardBorder: '#C4C4C4',
+        cardFilter: 'rgba(0, 0, 0, 0)',
+        cardOverlay: '#00000080',
+        hint: '#f1f1f1',
+
+        modes: {
+            dark: {
+                text: '#ffffff',
+                background: '#252525',
+                primary: '#6576CC',
+                cardText: '#424242',
+                cardBackground: 'rgba(0, 0, 0, 0.65)',
+                cardBorder: '#424242',
+                cardFilter: 'brightness(0.7)',
+                cardOverlay: '#42424280',
+                hint: '#101010',
+            }
+        }
+    },
+};
+
+class Document extends Doc {
+    static async getInitialProps(ctx) {
+        const initialProps = await Doc.getInitialProps(ctx)
+        return { ...initialProps }
+    }
+
+    render() {
+        return (
+            <Html>
+                <Head />
+                <body>
+                    <ThemeProvider theme={theme}>
+                        <Main />
+                        <NextScript />
+                    </ThemeProvider>
+                </body>
+            </Html>
+        )
+    }
+}
+
+export default Document;
\ No newline at end of file