diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2d87d633..b32899d4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -8,7 +8,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## Unreleased
 ### Added
 - Added `Share query` button to the Data tab
-
+### Fixed
+- Added autofocus to the login field on the login page
 
 ## [0.26.4] - 2024-09-13
 ### Added
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 946a9011..4a20d748 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -73,6 +73,7 @@ import { AccountComponent } from "./account/account.component";
 import { DatasetsTabComponent } from "./account/additional-components/datasets-tab/datasets-tab.component";
 import { AccessTokensTabComponent } from "./auth/settings/tabs/access-tokens-tab/access-tokens-tab.component";
 import { MatSlideToggleModule } from "@angular/material/slide-toggle";
+import { AutofocusDirective } from "./common/directives/autofocus.directive";
 
 const Services = [
     {
@@ -204,6 +205,7 @@ const MatModules = [
         AdminDashboardComponent,
         AccessTokensTabComponent,
         AccountFlowsTabComponent,
+        AutofocusDirective,
     ],
     imports: [
         AppRoutingModule,
diff --git a/src/app/auth/login/login.component.html b/src/app/auth/login/login.component.html
index 5882bdc5..a792074a 100644
--- a/src/app/auth/login/login.component.html
+++ b/src/app/auth/login/login.component.html
@@ -43,8 +43,8 @@ <h1 class="text-center text-muted mt-4">Login to Kamu</h1>
                 class="form-control d-inline"
                 id="login"
                 data-test-id="input-login"
-                required
-                (keyup)="resetPasswordLoginError()"
+                (keyup)="onChangeInputField($event)"
+                appAutofocus
                 [class.error-border-color]="passwordLoginError$ | async"
             />
             <div *ngIf="loginControl?.invalid && (loginControl?.touched || loginControl?.dirty)">
@@ -65,8 +65,7 @@ <h1 class="text-center text-muted mt-4">Login to Kamu</h1>
                 class="form-control d-inline"
                 id="password"
                 data-test-id="input-password"
-                required
-                (keyup)="resetPasswordLoginError()"
+                (keyup)="onChangeInputField($event)"
                 [class.error-border-color]="passwordLoginError$ | async"
             />
             <div *ngIf="passwordControl?.invalid && (passwordControl?.touched || passwordControl?.dirty)">
diff --git a/src/app/auth/login/login.component.ts b/src/app/auth/login/login.component.ts
index 9b79cffb..5ccd0c59 100644
--- a/src/app/auth/login/login.component.ts
+++ b/src/app/auth/login/login.component.ts
@@ -78,4 +78,10 @@ export class LoginComponent extends BaseComponent implements OnInit {
     public resetPasswordLoginError(): void {
         this.loginService.resetPasswordLoginError();
     }
+
+    public onChangeInputField(event: KeyboardEvent): void {
+        if (event.key !== "Enter") {
+            this.resetPasswordLoginError();
+        }
+    }
 }
diff --git a/src/app/common/directives/autofocus.directive.ts b/src/app/common/directives/autofocus.directive.ts
new file mode 100644
index 00000000..8c6913d0
--- /dev/null
+++ b/src/app/common/directives/autofocus.directive.ts
@@ -0,0 +1,14 @@
+import { AfterViewInit, Directive, ElementRef, inject } from "@angular/core";
+
+@Directive({
+    selector: "[appAutofocus]",
+})
+export class AutofocusDirective implements AfterViewInit {
+    private elementRef = inject(ElementRef);
+
+    ngAfterViewInit(): void {
+        setTimeout(() => {
+            (this.elementRef.nativeElement as HTMLElement).focus();
+        });
+    }
+}