diff --git a/public/index.html b/public/index.html
index 23034da..9088606 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,90 +1,23 @@
-<html>
+<!DOCTYPE html>
+<html lang="de">
 <head>
-    <title>Testseite</title>
+    <meta charset="UTF-8">
+    <title>Schics - Das Tool</title>
+    <link rel="stylesheet" href="css/styles.css">
 </head>
 <body>
-    <div><h1>Login Page</h1>
-    </div>
 
-<p id="error" style="display: none;"></p>
-        <input id="emailInput" placeholder="Email" />
-        <input id="passwordInput" placeholder="********" type="password" />
-        <button id="authBtn" onclick="authenticate()">
-            Submit
-        </button>
-        <hr />
-        <div class="register-content">
-        <p>Don&apos;t have an account?</p>
-        <button onclick="toggleIsRegister()" id="registerBtn">Sign up</button>    
+    <header>
+        <h1>Meine Schic-App</h1>
+        <nav>
+            <a href="login.html">Login</a>
+        </nav>
+    </header>
 
-<script>
-    // 1. Wir merken uns, in welchem Modus wir sind (Standard: Login)
-    let isRegisterMode = false;
+    <main>
+        <h2>Willkommen!</h2>
+        <p>Organisiere deine Aufgaben einfach und schnell.</p>
+    </main>
 
-    // 2. Diese Funktion wechselt den Modus, wenn man auf "Sign up" klickt
-    function toggleIsRegister() {
-        isRegisterMode = !isRegisterMode; // Wechselt von true zu false oder umgekehrt
-
-        const title = document.querySelector('h1');
-        const authBtn = document.getElementById('authBtn');
-        const registerBtn = document.getElementById('registerBtn');
-        const toggleText = document.querySelector('.register-content p');
-
-        if (isRegisterMode) {
-            title.innerText = "Register Page";
-            authBtn.innerText = "Create Account";
-            registerBtn.innerText = "Back to Login";
-            toggleText.innerText = "Already have an account?";
-        } else {
-            title.innerText = "Login Page";
-            authBtn.innerText = "Submit";
-            registerBtn.innerText = "Sign up";
-            toggleText.innerText = "Don't have an account?";
-        }
-    }
-
-    // 3. Die Hauptfunktion für den Klick auf "Submit" / "Create Account"
-    async function authenticate() {
-        const username = document.getElementById('emailInput').value;
-        const password = document.getElementById('passwordInput').value;
-        const errorDisplay = document.getElementById('error');
-
-        // Entscheide, an welche Tür (URL) wir klopfen
-        const endpoint = isRegisterMode ? '/auth/register' : '/auth/login';
-
-        try {
-            const response = await fetch(endpoint, {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ username, password })
-            });
-
-            const data = await response.json();
-
-            if (response.ok) {
-    // 1. Speichere den VIP-Pass (Token)
-    localStorage.setItem('token', data.token);
-    
-    // 2. Zeige kurz eine Meldung (optional)
-    console.log("Login erfolgreich, leite weiter...");
-
-    // 3. DER SPRUNG: Hier sagen wir dem Browser, er soll die Seite wechseln
-    window.location.href = 'dashboard.html'; 
-} else {
-                errorDisplay.innerText = data.message || "Fehler aufgetreten";
-                errorDisplay.style.display = 'block';
-            }
-        } catch (err) {
-    // Falls die Antwort kein JSON war oder der Server abgestürzt ist
-    console.error("Detail-Fehler:", err);
-    errorDisplay.innerText = "Fehler: Verbindung fehlgeschlagen oder User existiert bereits.";
-    errorDisplay.style.display = 'block';
-}
-    }
-</script>
-
-            
 </body>
-
-
 </html>
\ No newline at end of file
diff --git a/public/login.html b/public/login.html
new file mode 100644
index 0000000..1695c55
--- /dev/null
+++ b/public/login.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <meta charset="UTF-8">
+    <title>Login - Schic-App</title>
+    <link rel="stylesheet" href="css/styles.css">
+</head>
+<body>
+
+    <div class="container">
+        <h1>Login</h1>
+
+        <form id="loginForm">
+            <input type="text" id="username" placeholder="Username" required>
+            <input type="password" id="password" placeholder="Passwort" required>
+            <button type="submit">Einloggen</button>
+        </form>
+
+        <p id="errorMessage" class="error"></p>
+
+        <a href="index.html">Zurück zur Startseite</a>
+    </div>
+
+    <script src="js/login.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/public/css/styles.css b/public/login.js
similarity index 100%
rename from public/css/styles.css
rename to public/login.js
diff --git a/public/styles.css b/public/styles.css
new file mode 100644
index 0000000..d1db161
--- /dev/null
+++ b/public/styles.css
@@ -0,0 +1,65 @@
+body {
+    margin: 0;
+    font-family: Arial, sans-serif;
+    background-color: #f4f6f8;
+    color: #333;
+}
+
+header {
+    background-color: #1e293b;
+    color: white;
+    padding: 1rem 2rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+nav a {
+    color: white;
+    text-decoration: none;
+    font-weight: bold;
+}
+
+main {
+    padding: 3rem;
+    text-align: center;
+}
+
+.container {
+    max-width: 400px;
+    margin: 100px auto;
+    padding: 2rem;
+    background: white;
+    border-radius: 8px;
+    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
+    text-align: center;
+}
+
+input {
+    width: 100%;
+    padding: 0.8rem;
+    margin: 0.5rem 0;
+    border-radius: 4px;
+    border: 1px solid #ccc;
+}
+
+button {
+    width: 100%;
+    padding: 0.8rem;
+    margin-top: 1rem;
+    border: none;
+    background-color: #2563eb;
+    color: white;
+    border-radius: 4px;
+    cursor: pointer;
+    font-weight: bold;
+}
+
+button:hover {
+    background-color: #1d4ed8;
+}
+
+.error {
+    color: red;
+    margin-top: 1rem;
+}
\ No newline at end of file
