diff --git a/frontend/src/pages/LoginPage.tsx b/frontend/src/pages/LoginPage.tsx
new file mode 100644
index 0000000..6c4cba3
--- /dev/null
+++ b/frontend/src/pages/LoginPage.tsx
@@ -0,0 +1,27 @@
+import { LoginForm } from "@/components/partials/LoginForm"
+
+import { Helmet } from 'react-helmet-async'
+
+export default function LoginPage() {
+    return (
+        <>
+            <Helmet>
+                <title>Login | {__SITE_NAME__}</title>
+            </Helmet>
+            <div className="relative flex min-h-svh flex-col items-center justify-center bg-zinc-300 dark:bg-gray-800 p-6 md:p-10">
+                {/* Background Image */}
+                <img
+                    src="/images/login-bg-2560x1440.jpg"
+                    alt="Background"
+                    className="absolute inset-0 w-full h-full object-cover brightness-[0.6]"
+                />
+
+                {/* Content */}
+                <div className="relative z-10 w-full max-w-sm md:max-w-3xl">
+                    <LoginForm />
+                </div>
+            </div>
+        </>
+    )
+}
+