Show And Hide Passwords With Bootstrap 4

File Size: 14.9 KB
Views Total: 35959
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Show And Hide Passwords With Bootstrap 4

Yet another Bootstrap plugin that enables the user to toggle the password visibility by clicking the Show/Hide icons inside a password field. Fully compatible with Bootstrap 4.

See also:

How to use it:

1. Include the necessary Bootstrap 4 stylesheet in the header of the html page.

<link rel="stylesheet" 

2. Include the latest Font Awesome for the password toggle icons.

<link rel="stylesheet" 

3. Include the latest jQuery library and the bootstrap-show-password.js script right before the closing body tag.

<script src="" 
<script  src="/path/to/bootstrap-show-password.js"></script>

4. Add the password visibility toggle button to the password field. Done.

<div class="input-group">
  <input type="password" name="password" id="password" class="form-control" data-toggle="password">
  <div class="input-group-append">
    <span class="input-group-text">
      <i class="fa fa-eye"></i>

This awesome jQuery plugin is developed by abdo-host. For more Advanced Usages, please check the demo page or visit the official website.