diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index be58b60..eb41f35 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -438,6 +438,11 @@
     }
 
     /**
+     * Initialize password toggle.
+     */
+    initTogglePwdVisibility();
+      
+    /**
      * Initialize Plugin registry.
      */
     let pe;
diff --git a/dev/js/src/util.js b/dev/js/src/util.js
index 0fea33f..b8be33b 100644
--- a/dev/js/src/util.js
+++ b/dev/js/src/util.js
@@ -86,6 +86,30 @@
 };
 
 
+/**
+ * Add option to show passwords.
+ */
+function initTogglePwdVisibility () {
+    const el = document.querySelectorAll("input[type=password].show-pwd");
+    for (let x = 0; x < el.length; x++) {     
+        const pwd = el[x];
+
+        const a = document.createElement('a');
+        a.classList.add('showPWD');         
+        a.addEventListener('click', function () {
+            if (pwd.getAttribute("type") === "password") {
+                pwd.setAttribute("type", "text");
+                a.classList.add('hide');
+                return;
+            };
+            pwd.setAttribute("type", "password");
+            a.classList.remove('hide');
+        });
+        pwd.parentNode.insertBefore(a, pwd.nextSibling);
+    };
+};
+
+
 define(function () {
   // Todo: That's double now!
   KorAP.API = KorAP.API || {};
diff --git a/dev/scss/base/base.scss b/dev/scss/base/base.scss
index d5b646d..5e095a2 100644
--- a/dev/scss/base/base.scss
+++ b/dev/scss/base/base.scss
@@ -8,6 +8,7 @@
 @import "view";
 @import "menu";
 @import "banner";
+@import "showPWD";
 
 /**
  * Basic global CSS rules for Kalamar
@@ -137,4 +138,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/dev/scss/base/icons.scss b/dev/scss/base/icons.scss
index 24ee8eb..0a0c109 100644
--- a/dev/scss/base/icons.scss
+++ b/dev/scss/base/icons.scss
@@ -36,3 +36,5 @@
 $fa-redo:         "\f01e";
 $fa-warn:         "\f071";
 $fa-token:        "\1f511";
+$fa-show:         "\1f441";
+$fa-hide:         "\f070";
diff --git a/dev/scss/base/showPWD.scss b/dev/scss/base/showPWD.scss
new file mode 100644
index 0000000..75a6991
--- /dev/null
+++ b/dev/scss/base/showPWD.scss
@@ -0,0 +1,13 @@
+@import "icons";
+
+a.showPWD::after {
+    position: absolute;
+    @include icon-font;
+    width: 1em;
+    content: $fa-show;
+    cursor: pointer;
+    margin-left: -1em;
+}
+a.showPWD.hide::after {
+    content: $fa-hide;
+}
diff --git a/lib/Kalamar/Plugin/Auth/templates/auth/client.html.ep b/lib/Kalamar/Plugin/Auth/templates/auth/client.html.ep
index d42bf93..b8f5212 100644
--- a/lib/Kalamar/Plugin/Auth/templates/auth/client.html.ep
+++ b/lib/Kalamar/Plugin/Auth/templates/auth/client.html.ep
@@ -40,7 +40,7 @@
       % foreach (@{$c->stash('tokens')}) {
       <li class="token">
       %= label_for 'token' => loc('Auth_accessToken')
-      %= text_field '', value => $_->{token}, readonly => 'readonly', class => 'show-pwd copy-to-clipboard'
+      %= password_field '', value => $_->{token}, readonly => 'readonly', class => 'show-pwd copy-to-clipboard'
       <p name="created"><%== loc('Auth_createdAt', date => $_->{created_date}) %></p>
       <p name="expires"><%== loc('Auth_expiresIn', seconds => $_->{expires_in}) %></p>
       % if ($_->{scope}) {