diff --git a/src/components/Login/index.tsx b/src/components/Login/index.tsx
new file mode 100644
index 00000000..e369f7c2
--- /dev/null
+++ b/src/components/Login/index.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import PlexLoginButton from '../PlexLoginButton';
+
+const Login: React.FC = () => {
+  return (
+    <div className="w-full">
+      <form className="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4">
+        <div className="flex justify-center text-gray-900 font-bold text-xl mb-2">
+          Overseerr
+        </div>
+        <div className="flex justify-center text-gray-900 text-sm pb-6 mb-2">
+          would like to sign in to your Plex account
+        </div>
+        <div className="flex items-center justify-center">
+          <PlexLoginButton
+            onAuthToken={(authToken) =>
+              console.log(`auth token is: ${authToken}`)
+            }
+          />
+        </div>
+      </form>
+      <p className="text-center text-gray-500 text-xs">
+        &copy;2020 Overseerr. All rights reserved.
+      </p>
+    </div>
+  );
+};
+
+export default Login;
diff --git a/src/pages/login.tsx b/src/pages/login.tsx
new file mode 100644
index 00000000..5b390e2d
--- /dev/null
+++ b/src/pages/login.tsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import { NextPage } from 'next';
+import Login from '../components/Login';
+
+const LoginPage: NextPage = () => {
+  return (
+    <div className="w-full">
+      <Login />
+    </div>
+  );
+};
+
+export default LoginPage;