Chroma Hash

A colorful visualization of password field input
Alternatives To Chroma Hash
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Owid Grapher1,165
15 hours ago231mitTypeScript
A platform for creating interactive data visualizations
Chroma Hash634
5 years ago1June 29, 2014mitJavaScript
A colorful visualization of password field input
9 years ago3apache-2.0Java
A classic password visualization concept, ported to Android
Traffic Map23
7 years ago1gpl-2.0Python
Network traffic mapping software that collects TCP traffic and produces JSON D3 visualization
8 months ago2apache-2.0JavaScript
The container infrastructure for the SPOT performance visualization tool
5 years ago
The repo of "Exploring the Network of Real-World Passwords: Visualization and Estimation" in SecureComm 2017.
6 years agoPython
Data Visualization Projects
Julie And Julia2
6 years agomitJavaScript
Text visualization of the film Julie & Julia (2009) script
Redash Helm2
3 years agobsd-2-clauseSmarty
A Helm chart for redash
11 years ago4Python
A visualization of yahoos leaked passwords
Alternatives To Chroma Hash
Select To Compare

Alternative Project Comparisons


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 function
  • minimum : the minimum number of characters needed for grayscale bars to be displayed in color


  • jQuery 1.3+

Ports, Implementations, and Adaptations

Chroma-Hash is also available in your choice of JavaScript libraries and languages:

For the more acoustically-inclined, check out Sonic-Hash, which uses sounds instead of colors.


Inspired by Arc90 Lab's HashMask, by Chris Dary

Chroma-Hash uses Paul Johnston's Javascript MD5 implementation, and is distributed under the BSD License See 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.

Popular Password Projects
Popular Visualization Projects
Popular Security Categories

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.