-
Notifications
You must be signed in to change notification settings - Fork 23
/
entropy.html
89 lines (88 loc) · 5.11 KB
/
entropy.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<html lang='en'>
<head>
<link rel='shortcut icon' href='favicon.ico'>
<link rel='stylesheet' href='assets/style.css'>
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
<meta name='color-scheme' content='dark light'>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<title>Passphrase and Password Generator</title>
</head>
<body>
<div id='container'>
<div id='header'>
<h1>Mouse Entropy</h1>
<ul id='navigation'>
<li><a href='index.html'>Passwords</a></li>
<li><a href='entropy.html'>Entropy</a></li>
<li><a href='bookmarklets.html'>Bookmarklets</a></li>
<li>
<a href='javascript:void(0)' onclick='toggleTheme();' id='theme_switcher' title='Change theme'>
<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='currentColor' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-moon'>
<path d='M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z'></path>
</svg>
</a>
</li>
</ul>
</div>
<div id='content'>
<p>Capture arbitrary bits to build a <strong>true random</strong> password by moving your mouse/finger across the noise below. This utilizes your mouse/finger movements as a source of entropy. Inspired by <a href='https://keepass.info'>KeePass</a>.</p>
<p class='collected'>Collected:
<span class='collected' id='entropyResult2'>0</span> samples
(<span class='collected' id='entropyResult1'>0</span> bits)
</p>
<canvas id='randogram' height='400' width='400'></canvas>
<p class='collected'>Current rank:
<span class='collected' id='officerRank'>Cadet</span>
<span class='collected' id='rankPips'></span><br/>
Next rank: <span class='collected' id='nextRank'></span> in
<span class='collected' id='remainingRankBits'></span> bits
</p>
<h2>FAQ</h2>
<p>
<ul>
<li><strong>What is the goal?</strong> To add entropy to the browser CSPRNG to produce a true random password.</li>
<li><strong>Do I need it?</strong> Most likely not. Your passwords are already secure even if you don't use this tool.</li>
<li><strong>Why then?</strong> Paranoia—you suspect the browser CSPRNG is compromised or not sufficiently seeded.</li>
<li><strong>What is a "sample"?</strong> It's 16 bits that can be used for a passphrase word or password character.</li>
<li><strong>How much do I need?</strong> You'll need about 5-7 samples per passphrase, and 11-15 samples per password.</li>
<li><strong>Then what?</strong> Go back to the <a href='index.html'>password generator</a>, check "Add entropy?", then the purple "Generate" button.</li>
<li><strong>Star Trek? Seriously?</strong> A bit of fun collecting entropy. The more bits you collect, the higher your rank.</li>
<li><strong>What are the ranks?</strong> There are 13 ranks from "Cadet" to "Fleet Admiral". It grows exponentially.</li>
</ul>
</p>
<h2>Technical</h2>
<p>
<ol>
<li>The noise above is generated with the browser's CSPRNG.</li>
<li>When your mouse or finger is moved, the bit at the xy-coordinate is collected.</li>
<li>When two bits are collected, they are decorrelated using <a href='https://en.wikipedia.org/wiki/Hardware_random_number_generator#Software_whitening'>John von Neumann's randomness extractor</a>.</li>
<li>16 decorrelated bits are stored in an array as 1 sample.</li>
<li>During password generation, each 16-bit sample is mixed with the browser CSPRNG using XOR.</li>
<li>Each used 16-bit sample is then discarded.</li>
</ol>
</p>
</div>
<div id="footer" class="clear">
<p>Never trust online password generators, including this one.<br/>
For better security, use the <a href="bookmarklets.html">bookmarklets</a>, or my <a href="https://github.com/atoponce/nodepassgen">command-line tool</a>.<br/>
For best security, use the generator that ships with your password manager.</p>
<p><strong>For demonstration purposes only. It is not logging passwords.</strong></p>
<p>
<a href="https://github.com/atoponce/webpassgen"><img alt="Github logo" title="Get the source code" src="assets/github.png" /></a>
<a href="https://github.com/atoponce/webpassgen/releases/latest"><img alt="Download icon" title="Download latest release" src="assets/download.png" /></a>
<a href="https://twitter.com/AaronToponce"><img alt="Twitter logo" title="Meet the author" src="assets/twitter.png" /></a>
</p>
<p id='version'>Version: development</p>
</div>
</div>
<script src='js/main.js'></script>
<script src='js/randogram.js'></script>
<script>
"use strict"
window.onload = function () {
initTheme()
}
</script>
</body>
</html>