diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
new file mode 100644
index 0000000..944ec45
--- /dev/null
+++ b/src/components/Layout.tsx
@@ -0,0 +1,22 @@
+import { FunctionComponent } from 'react';
+import { classNames } from '@/utils/client';
+
+export type LayoutProps = {
+	className?: string;
+	children: React.ReactNode;
+};
+
+const Layout: FunctionComponent<LayoutProps> = ({ children, className }) => {
+	return (
+		<div
+			className={classNames(
+				'flex text-zinc-200 bg-zinc-900 min-h-screen h-full flex-col justify-center py-12 sm:px-6 lg:px-8',
+				className
+			)}
+		>
+			{children}
+		</div>
+	);
+};
+
+export default Layout;
diff --git a/src/pages/api/check.ts b/src/pages/api/check.ts
index 0652606..1b8f266 100644
--- a/src/pages/api/check.ts
+++ b/src/pages/api/check.ts
@@ -1,5 +1,5 @@
 import type { NextApiRequest, NextApiResponse } from 'next';
-import { unauthorized } from '@/utils/helpers';
+import { unauthorized } from '@/utils/server';
 
 type StatusData = { status: ResponseStatus };
 
diff --git a/src/pages/api/config.ts b/src/pages/api/config.ts
index 19a9d12..3d336b5 100644
--- a/src/pages/api/config.ts
+++ b/src/pages/api/config.ts
@@ -1,7 +1,7 @@
 import type { NextApiRequest, NextApiResponse } from 'next';
 import { fetchConfiguration, setConfiguration } from '@/db';
 import { Configuration, ConfigurationSchema } from '@/timing';
-import { unauthorized } from '@/utils/helpers';
+import { unauthorized } from '@/utils/server';
 
 type StatusData = { status: ResponseStatus };
 
diff --git a/src/pages/api/cron.ts b/src/pages/api/cron.ts
index 75e035c..3da3ccc 100644
--- a/src/pages/api/cron.ts
+++ b/src/pages/api/cron.ts
@@ -11,7 +11,8 @@ import {
 } from '@/db';
 import { localNow } from '@/utils/timezone';
 import logger from '@/logger';
-import { parseBoolean, unauthorized } from '@/utils/helpers';
+import { parseBoolean } from '@/utils/client';
+import { unauthorized } from '@/utils/server';
 
 type ResponseData = {
 	diff: number;
diff --git a/src/utils/client.ts b/src/utils/client.ts
new file mode 100644
index 0000000..55dd14f
--- /dev/null
+++ b/src/utils/client.ts
@@ -0,0 +1,12 @@
+export function parseBoolean(
+	value: string | string[] | undefined | null
+): boolean {
+	if (value == undefined) return false;
+	if (Array.isArray(value)) return false;
+	value = value.toLowerCase();
+	return value === 'true' || value === '1' || value === 'yes';
+}
+
+export function classNames(...classes: (string | undefined)[]): string {
+	return classes.filter(Boolean).join(' ');
+}
\ No newline at end of file
diff --git a/src/utils/helpers.ts b/src/utils/server.ts
similarity index 58%
rename from src/utils/helpers.ts
rename to src/utils/server.ts
index 59dc9be..4aaafcc 100644
--- a/src/utils/helpers.ts
+++ b/src/utils/server.ts
@@ -12,13 +12,4 @@ export function unauthorized(
 		return true;
 	}
 	return false;
-}
-
-export function parseBoolean(
-	value: string | string[] | undefined | null
-): boolean {
-	if (value == undefined) return false;
-	if (Array.isArray(value)) return false;
-	value = value.toLowerCase();
-	return value === 'true' || value === '1' || value === 'yes';
-}
+}
\ No newline at end of file