Check Password Strength with jQuery Plugin

I was developing an Web Application recently. Like all other web app, this has user registration process and  password field for user. My client wanted to use a Password Strength Meter to indicate user how strong is his/her password. Well that’s a nice and must have feature for most of apps now.

I been searching for a jQuery plugin for this password strength feature and found a lots of plugins available for use. Well, I can’t use a lot of plugins but just one and I had to pick only one and I picked a simple one.

I choose this jQuery Password Strength Plugin from many. Reason for this choosing is,

  • easy to use
  • small but good documentation
  • little but necessary customization options

How to use Query Password Strength Plugin


  • jQuery
  • jquery.passstrength.js or jquery.passstrength.min.js

Download jquery.passstrength.js or jquery.passstrength.min.js from original site and keep them in your root folder or any folder you want (figure1)

Files for password strength meeter
Figure 1

Assume following is your html for password field in index.html (figure2)

<div id="passwordmeter">
  <label for="password">Password</label>
  <input type="password" id="password"/>
password field
Figure 2

Now add the following javascript at bottom of your page (before </body>).

<script type="application/javascript" src=""></script>
<script type="application/javascript" src="passstrength.min.js"></script>
<script type="application/javascript">

Well, that’s it. This should be working like this now.

Password Strength Meeter
Password Strength Meeter

See the demo here. Download Demo

Author: Ariful Haque

Software Engineer | Freelance Web Application Developer PHP, CodeIgniter, WordPress, JavaScript, jQuery, Ajax, Ubuntu, CentOS, Apache..

Leave a Reply

Your email address will not be published. Required fields are marked *