jQuery Plugin For Password Input Enhancement - Strength.js

File Size: 13.9 KB
Views Total: 2728
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin For Password Input Enhancement - Strength.js

Strength.js is an useful jQuery password input enhancement that validates/indicates the password strength and provides a function to show/hide password your user input.

Default validation rules:

  • At least 8 characters
  • At least one number
  • At least one uppercase letter
  • At least one lowercase letter

Basic Usage:

1. Include jQuery JavaScript library and the jQuery strength.js script at the bottom of your webpage.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="strength.js"></script>

2. Add an unique ID to your password input.

<input id="demo" type="password" name="" value="">

3. Call the plugin on the password input.

  strengthClass: 'strength', // CSS class
  strengthMeterClass: 'strength_meter', // CSS class
  strengthButtonClass: 'button_strength', // CSS class
  strengthButtonText: 'Show Password',
  strengthButtonTextToggle: 'Hide Password'

4. Style the password strength indicator via CSS.

.strength_meter {

.strength_meter div {

.strength_meter div p {

.veryweak {

.weak {

.medium {

.strong {

Change log:


  • avoid 3 passwords being marked as "medium" strength

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