diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 7f0657d..d0683e9 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -1,10 +1,10 @@
-import { Routes } from '@angular/router';
-import { LoginViewComponent } from './components/login-view/login-view.component';
-import { MitarbeiterverwaltungViewComponent } from './components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component';
-import { EmployeeDetailComponent } from './components/employee-detail/employee-detail.component';
-import { QualifikatonBearbeitenViewComponent } from './components/qualifikaton-bearbeiten-view/qualifikaton-bearbeiten-view.component';
-import { KeycloakAuthGuard } from 'keycloak-angular';
-import { AuthGuard } from './service/auth.service';
+import { Routes } from "@angular/router";
+import { LoginViewComponent } from "./components/login-view/login-view.component";
+import { MitarbeiterverwaltungViewComponent } from "./components/mitarbeiterverwaltung-view/mitarbeiterverwaltung-view.component";
+import { EmployeeDetailComponent } from "./components/employee-detail/employee-detail.component";
+import { QualifikatonBearbeitenViewComponent } from "./components/qualifikaton-bearbeiten-view/qualifikaton-bearbeiten-view.component";
+import { KeycloakAuthGuard } from "keycloak-angular";
+import { AuthGuard } from "./service/auth.service";
 
 export const routes: Routes = [
   {
@@ -26,6 +26,6 @@ export const routes: Routes = [
   },
   {
     path: "**",
-    redirectTo: '',
-  }
+    redirectTo: "",
+  },
 ];
diff --git a/src/app/components/login-view/login-view.component.html b/src/app/components/login-view/login-view.component.html
index d73e36d..c1234f8 100644
--- a/src/app/components/login-view/login-view.component.html
+++ b/src/app/components/login-view/login-view.component.html
@@ -1,15 +1,8 @@
-
-<div class="container" style="width: 100%;">
+<div class="container" style="width: 100%">
   <h1>Hi-Tec GmbH</h1>
-  <img src="img.png" alt="Logout Icon" class="logo-image">
+  <img src="img.png" alt="Logout Icon" class="logo-image" />
 
   <form>
-    <label for="username">Username</label>
-    <input type="text" id="username" name="username"><br>
-
-    <label for="password">Password</label>
-    <input type="password" id="password" name="password"><br><br>
-
-    <button type="submit">Anmelden</button>
+    <button (click)="login()" type="submit">Mit KeyCLoak anmelden</button>
   </form>
 </div>
diff --git a/src/app/components/login-view/login-view.component.ts b/src/app/components/login-view/login-view.component.ts
index 9e9655e..c15e6cf 100644
--- a/src/app/components/login-view/login-view.component.ts
+++ b/src/app/components/login-view/login-view.component.ts
@@ -1,12 +1,22 @@
-import { Component } from '@angular/core';
-import { KeycloakService } from 'keycloak-angular';
+import { Component } from "@angular/core";
+import { Router } from "@angular/router";
+import { KeycloakService } from "keycloak-angular";
 
 @Component({
-  selector: 'app-login-view',
+  selector: "app-login-view",
   standalone: true,
   imports: [],
-  templateUrl: './login-view.component.html',
-  styleUrl: './login-view.component.css'
+  templateUrl: "./login-view.component.html",
+  styleUrl: "./login-view.component.css",
 })
 export class LoginViewComponent {
+  constructor(
+    private keyCloak: KeycloakService,
+    private router: Router,
+  ) {}
+
+  login(): void {
+    this.keyCloak.login();
+    this.router.navigate(["/mitarbeiter"]);
+  }
 }