Password entry can be frustrating, especially with long or difficult passwords. On a webpage, secure fields obscure your input with •'s so others can't read it. Unfortunately, neither can you --- you can't tell if you got your password right until you click "Log In".
Chroma-Hash is a jQuery plugin that visualizes secure text-field values using ambient color bars.
Chroma-Hash displays a series of colored bars at the end of field inputs so you can instantly tell if your password is right. The script takes a hash of your input to compute the colors in the visualization; the resulting color pattern is non-reversible, so no one can determine your password from the colors alone.
$("input:password").chromaHash({bars: 3, salt:"7be82b35cb0199120eea35a4507c9acf", minimum:6});bars: the number of bars displayed (1, 2, 3, or 4)salt: the value to be appended when calculating hash functionminimum: the minimum number of characters needed for grayscale bars to be displayed in color
- jQuery 1.3+
Chroma-Hash is also available in your choice of JavaScript libraries and languages:
- CHChromaHashView (iOS) - @mattt (Mattt)
- ChromaHashView (Android) - @michaelevans (Michael Evans)
- YUI3 - @foxxtrot (Jeff Craig)
- Prototype - @wki (Wolfgang Kinkeldei)
- pyChroma (Python) - @leegao (Lee Gao)
- ChromaHash4j (Java) - @efi (Thomas Efer)
For the more acoustically-inclined, check out Sonic-Hash, which uses sounds instead of colors.
Inspired by Arc90 Lab's HashMask, by Chris Dary http://lab.arc90.com/2009/07/hashmask.php
Chroma-Hash uses Paul Johnston's Javascript MD5 implementation, and is distributed under the BSD License See http://pajhome.org.uk/crypt/md5 for more info.
Thanks to Ian Young for his suggestion to represent color components in 4-bits to increase overall security.
Mattt (@mattt)
Chroma-Hash is released under the MIT license. See the LICENSE file for more info.