diff --git a/cmd/web/handlers.go b/cmd/web/handlers.go
index 401d524..b97c83e 100644
--- a/cmd/web/handlers.go
+++ b/cmd/web/handlers.go
@@ -283,3 +283,9 @@ func (app *application) BronzePlanReceipt(w http.ResponseWriter, r *http.Request
 		app.errorLog.Println(err)
 	}
 }
+
+func (app *application) LoginPage(w http.ResponseWriter, r *http.Request) {
+	if err := app.renderTemplate(w, r, "login", &templateData{}); err != nil {
+		app.errorLog.Println(err)
+	}
+}
diff --git a/cmd/web/routes.go b/cmd/web/routes.go
index 9b8c681..312890e 100644
--- a/cmd/web/routes.go
+++ b/cmd/web/routes.go
@@ -22,6 +22,9 @@ func (app *application) routes() http.Handler {
 	mux.Get("/plans/bronze", app.BronzePlan)
 	mux.Get("/receipt/bronze", app.BronzePlanReceipt)
 
+	// auth routes
+	mux.Get("/login", app.LoginPage)
+
 	fileServer := http.FileServer(http.Dir("./static"))
 	mux.Handle("/static/*", http.StripPrefix("/static", fileServer))
 
diff --git a/cmd/web/templates/base.layout.gohtml b/cmd/web/templates/base.layout.gohtml
index feba797..6632865 100644
--- a/cmd/web/templates/base.layout.gohtml
+++ b/cmd/web/templates/base.layout.gohtml
@@ -51,6 +51,11 @@
                             </ul>
                         </li>
                     </ul>
+                    <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                        <li class="nav-item">
+                            <a href="/login" class="nav-link">Login</a>
+                        </li>
+                    </ul>
                 </div>
             </div>
         </nav>
diff --git a/cmd/web/templates/login.page.gohtml b/cmd/web/templates/login.page.gohtml
new file mode 100644
index 0000000..59f4f94
--- /dev/null
+++ b/cmd/web/templates/login.page.gohtml
@@ -0,0 +1,38 @@
+{{ template "base" . }}
+{{ define "title" }}
+Login
+{{ end }}
+{{ define "content" }}
+<form action=""
+      method="post"
+      name=""
+      id=""
+      class="d-blick needs-validation"
+      autocomplete="off"
+      novalidate="">
+    <h2 class="mt-2 mb-3 text-center">Login</h2>
+    <hr>
+    <div class="mb-3">
+        <label for="-email" class="form-label">Email</label>
+        <input type="text"
+               id="email"
+               name="email"
+               autocomplete="email-new"
+               required=""
+               class="form-control">
+    </div>
+    <div class="mb-3">
+        <label for="password" class="form-label">Password</label>
+        <input type="text"
+               id="password"
+               name="password"
+               autocomplete="password-new"
+               required=""
+               class="form-control">
+    </div>
+    <hr>
+    <a href="javascript:void(0)" class="btn btn-primary">Login</a>
+</form>
+{{ end }}
+{{define "js"}}
+{{end}}