diff --git a/templates/auth/login/index.html b/templates/auth/login/index.html
index 66e2e7e7..f5c2d1e9 100644
--- a/templates/auth/login/index.html
+++ b/templates/auth/login/index.html
@@ -16,13 +16,13 @@
     <h1 class="form__title">
       Signin to mCaptcha
     </h1>
-    <label class="sitekey-form__label" for="username">
-      Username
+    <label class="sitekey-form__label" for="login">
+      Username or email address
       <input
         class="sitekey-form__input"
         type="text"
-        name="username"
-        id="username"
+        name="login"
+        id="login"
         required
       />
     </label>
diff --git a/templates/auth/login/ts/index.ts b/templates/auth/login/ts/index.ts
index e8f933ff..38d18bca 100644
--- a/templates/auth/login/ts/index.ts
+++ b/templates/auth/login/ts/index.ts
@@ -27,14 +27,14 @@ import createError from '../../../components/error/index';
 
 const login = async (e: Event) => {
   e.preventDefault();
-  const usernameElement = <HTMLInputElement>document.getElementById('username');
-  if (usernameElement === null) {
-    console.debug('Username element is null');
+  const loginElement = <HTMLInputElement>document.getElementById('login');
+  if (loginElement === null) {
+    console.debug('login element element is null');
     return;
   }
 
-  const username = usernameElement.value;
-  isBlankString(username, 'username', e);
+  const login = loginElement.value;
+  isBlankString(login, 'username', e);
 
   const passwordElement = <HTMLInputElement>document.getElementById('password');
   if (passwordElement === null) {
@@ -45,7 +45,7 @@ const login = async (e: Event) => {
   const password = passwordElement.value;
 
   const payload = {
-    username,
+    login,
     password,
   };