diff --git a/src/routes/login/+page.server.ts b/src/routes/login/+page.server.ts
new file mode 100644
index 0000000..d89701f
--- /dev/null
+++ b/src/routes/login/+page.server.ts
@@ -0,0 +1,10 @@
+import type { Actions } from "./$types"
+
+export const actions = {
+	login: ({ }) => {
+
+		console.log("login")
+
+		return {}
+	}
+} satisfies Actions;
diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte
new file mode 100644
index 0000000..2647e4c
--- /dev/null
+++ b/src/routes/login/+page.svelte
@@ -0,0 +1,50 @@
+<script lang="ts">
+
+</script>
+
+<form action="?/login" method="POST" id="form_login"></form>
+
+<div class="container">
+		
+	<div class="grid">
+		<h1>Login</h1>
+		<label for="username">Benutzername: </label><input type="text" id="username" form="form_login" name="username" />
+		<label for="password">Passwort: </label><input type="password" id="password" form="form_login" name="password" />
+		<button type="submit" form="form_login">-></button>
+	</div>
+
+</div>
+
+<style>
+
+	.container {
+		display: flex;
+		width: 100%;
+		height: 100%;
+
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.grid {
+		display: grid;
+		gap: 10px 50px;
+		grid-template-columns: 1fr 3fr;
+		justify-content: space-between;
+	}
+
+	.grid > h1 {
+		width: 100%;
+		text-align: center;
+		grid-column: 1 / span 2;
+	}
+
+	.grid > button {
+		width: 50%;
+		margin-top: 10px;
+		margin-left: auto;
+		grid-column: 2;
+	}
+
+</style>