A simple and fast javascript-based password generator
- choose length of password (min 6)
- include a personal string (e.g. your name, birth date, ...) [not recommended]
- copy to clipboard
- debug information
- add / remove ui elements with keywords
- 'readable' option (remove all special characters)
- abstract certain characters (e.g. 1 -> ! or A -> 4)
- Add the latest jQuery via Google Hosted Libraries to your project head
- Add the
pwgen.js
or (pwgen.min.js
) file aswell
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="path/to/pwgen.js"></script>
</head>
Add this at the end of your file:
<script>
$('.your-class').pwgen();
</script>
- Add the
style.css
orstyle.min.css
file to your project head - fully responsive design (
.pwgen
's size gets adjusted based on screen size). The responsive design can be toggled. See here.
<head>
<link href="path/to/style.css" rel="stylesheet" type="text/css">
</head>
The script can be configured the way you like in the following fashion:
<script>
$('.your-class').pwgen({
'foo': bar,
'dog': lazy
});
</script>
Supported keywords:
Toggles if the container uses responsive design.
TypeError results in 'responsive' = true
'responsive': true
supported values: true / false (boolean)
default: true
Toggles if the length input field is displayed.
TypeError results in 'length_field' = false
If the length input field isn't displayed ('length_field' = false
) the script uses a length between max_length
and min_length
'length_field': true
supported values: true / false (boolean)
default: true
Toggles if the inlude input field is displayed.
TypeError results in 'include_field' = false
'include_field': true
supported values: true / false (boolean)
default: true
Toggles if the 'readable' checkbox is displayed.
TypeError results in 'readable' = false
'readable': true
supported values: true / false (boolean)
default: false
Toggles if the hint box is displayed
TypeError results in 'show_hint' = true
'show_hint': true
supported values: true / false (boolean)
default: true
Toggles if 'copy to clipboard' is displayed
TypeError results in 'show_copy' = true
'show_copy': true
supported values: true / false (boolean)
default: true
Toggles if debug switch is displayed
TypeError results in 'show_debug' = false
'show_debug': true
supported values: true / false (boolean)
default: false
Set the minimum length of the password.
TypeError results in 'min_length' = 6
'min_length': 6
supported values: numeric
default: 6
Set the maximum length of the password.
TypeError results in 'max_length' = 12
'max_length': 12
supported values: numeric
default: 12
Set an include string to be included in every generated password.
TypeError results in 'include' = ''
'include': 'foo'
supported values: string
default: ''
Where to append 'include' to user-entered include string.
TypeError results in 'include_append' = 'right'
'include_append': 'right'
supported values: 'right' / 'left'
default: 'right'
Example:
user: foo
'include': bar
- 'include_append': 'left'
bar|foo
- 'include_append': 'right'
foo|bar
<script>
$('.your-class').pwgen({
'responsive': true,
'min_length': 8,
'max_length': 12,
'include': 'foo',
'include_append': 'right',
'length_field': false;
});
</script>
- container uses responsive design
- password has a minimum length of 8
- password has a maximum length of 12
- 'foo' gets included into every password [again not recommended]
- 'foo' gets appended on the right
- no length input field is displayed (results in random number between 8 [inclusive] and 12 [inclusive])