Advanced Password Strength Test

By vaseline28 on Jul 12, 2008

If you're a little unsure on Javascript, I recommend that you use the simple version of the script found here.

Live Demo!

This script evaluates a password by checking:

  • Length
  • Amount/Existence of Numbers
  • Capital/Lowercase Ratio (for case-sensitive passwords - as nearly all are)

Set up Guide:

<body><div style="background-color:FFF5CF; position: absolute; width: 461px; height: 36px; z-index: 1; left: 11px; top: 14px" id="PassWord Field">
<div style="position: absolute; width: 272px; height: 6px; z-index: 3; left: 172px; top: 14px" id="Strength Visual">
<div style="position: absolute; width: 271px; height: 12px; z-index: 2; left: 173px; top: 3px" id="Strength Box">
    <font id="Display" size="2">Password Strength:</font></div>
<div style="position: absolute; width: 161px; height: 11px; z-index: 1; left: 6px; top: 7px" id="EntryBox">
<input onkeypress='Javascript:PassWord()' type="password" id="Password"></div>

Paste below script into the


The below is only the Javascript if you want the HTML which was used in the Demo, please PM me or paste the HTML from the code tags above.

For a Preview check out the Live Demo!

<script type="text/javascript">
function PassWord () {
  a=document.getElementById('Password').value ;
  PassWordStrength(a,b) ;
function PassWordStrength (a,b) {
  //Awards Points for Length
  if (a.length<12) {
   c=a.length/2 ; l=c.toFixed(0) ; g=0 ;
   while (g<l) {
     b=b+1 ; g=g+1 ;
  else { b=b+6 ; }
  //This section awards points for existence and number of numbers in the Password Field
  numTest=new RegExp("[0-9]","g") ;
  numVal=1 ; c="" ;
  while (numVal!=null) {
    numVal=numTest.exec(a) ; c=c+numVal ;
  g=0 ; d="" ;
  if (c.length-4<2) { b=b+0 ; }
  else if (c.length-4<4) { b=b+2 ; }
  else if (c.length-4<8) { b=b+4 ; }
  else { b=b+6 }
  //The final evaluating section will add points for the ratio of Capitalised/LowerCase
  capTest=new RegExp("[A-Z]","g") ;
  capVal=1 ; c="" ;  Total="" ;
  while (capVal!=null) {
    capVal=capTest.exec(a) ; c=c+capVal ; Total=Total+capVal
  lowerTest=new RegExp("[a-z]","g") ;
  lowerVal=1 ; d="" ;
  while (lowerVal!=null) {
    lowerVal=lowerTest.exec(a) ; d=d+lowerVal ; Total=Total+lowerVal
  Per=Total.length-8 ; Perc=Per/100 ; Percent=Perc*1 ; Cap=c.length-4 ; Capo=Percent*Cap ; Caps=Capo.toFixed(0) ; Low=d.length-4 ; Lowe=Percent*Low ; Lower=Lowe.toFixed(0) ; difference=Caps-Lower;
  if (difference<60) {
    dif=difference/10 ; diff=dif.toFixed(0) ; diff=diff-1 ; g=0 ;
    while (g<diff) {
      g=g+1 ; b=b+1 ;
  else { b=b+6 }   
  //This section converts the points gained into a bar
  f=0 ; Bar="" ;
  while (f<b*2) { f=f+1 ; Bar=Bar+"_" ; }
  //And then the Bar into Wording with the Points next to it
  if (Bar.lengthɡ) { StrengthFinal="<b><font color='red'>WEAK</font></b> Points:"+b*2 ; Bar="<font color='red'>"+Bar+"</font>" ;}
  else if (Bar.lengthគ) { StrengthFinal="<b><font color='CC6600'>MODERATE</font></b>   Points:"+b*2; Bar="<font color='CC6600'>"+Bar+"</font>" ;}
  else if (Bar.lengthឈ) { StrengthFinal="<b><font color='FF9933'>MODERATELY-STRONG</font></b>   Points:"+b*2; Bar="<font color='FF9933'>"+Bar+"</font>" ;}
  else { StrengthFinal="<b><font color='green'>STRONG</font></b>   Points:"+b*2; Bar="<font color='green'>"+Bar+"</font>" }
  //The area below defines where the information about the password is put.
  document.getElementById('Strength Box').innerHTML=StrengthFinal ;
  document.getElementById('Strength Visual').innerHTML=Bar ;


Sign in to comment.
Pass   -  Dec 14, 2010

During the demo, when the backspace key is first pressed (& a character is deleted) the rating goes up, but only when the "points" are greater than 4.

Try entering "testing" then deleting a letter

vaseline28   -  Nov 11, 2009

It probably won't but I just chucked that in to show how to use the script, obviously if using it in a site you would ammend the HTML to your needs.

GlobalAnomaly   -  Aug 17, 2009

I don't know much about JavaScript, but the HTML in the example doesn't look like it'd pass by W3C Standards :o (XHTML 1.0 Strict)

Use CSS more.

body {background:FFF5CF;position:absolute;width:461px;height:36px;z-index:1;left:11px;top:14px;}


vaseline28   -  Aug 27, 2008

That's because even just numbers is good (although not as good as you can get).
So it hardly is a cheat, the only way to change that would be to adjust it so that it evaluates the percentage between letters and numbers.

stargazer989   -  Aug 19, 2008

ROFL. you can "cheat" it by using only numbers and you get a highscore...

EL   -  Jul 12, 2008

Rofl it would be neat to upload except i wouldnt know wtf to do with it since i dunno a damn thing about javascript and ugh i seriously need to expand to different coding languges to ;o

vaseline28   -  Jul 12, 2008

It\'s shorter than it used to be. Before it was made up of 6 functions. You could cut the first one out, but it eases the DHTML.
And yes, a lot of code to generate two lines!

If you were worried about the size, you could upload it elsewhere and use a
<script type=\"text/javascript\" src=\"HERE URL\">

EL   -  Jul 12, 2008

Very cool again and damn thats alot of code for something that seems so easy when you look at it.`-.-´

vaseline28   -  Jul 12, 2008

I\'m having some problems here (PMed Hawkee though).
When pasting my script, this website seems to be changing some of the symbols to question marks etc.
Either look at the source on the Demo, or PM me for a link to an upload of the script which I will do if you wish to use this - until this gets sorted out.

Are you sure you want to unfollow this person?
Are you sure you want to delete this?
Click "Unsubscribe" to stop receiving notices pertaining to this post.
Click "Subscribe" to resume notices pertaining to this post.