Built password generator with HTML, CSS & JavaScript
The first criteria field the user can select is Number of characters. The number can be set by using the built in slider, by moving the arrow up/down in the input field or by simply typiing a number in the input field.
Second crieteria lets the user pick if the password needs to include an uppercase letters. The user can check the input box if that is his/her preference.
Same as above the user can select this field by checking the box presented. If this option is marked the password will include numbers.
The option will add special symbols to the generated password. The user can select the box if he/she expects the password to include such characters.
Once done the user can select the Generate Password button which will display the password which will meet all given criteria
In the example below we have a password that has a length of 12, it includes uppercase characters, numbers and special characters. This is because the user selected number of characters to be 12 and the user selected all 3 optional fields for uppercase letters, numbers and symbols.
The tool works if only one or any given number of of the optional fields is selected. The example below is with selected length of 10 and include numbers box selected
The number of characters field does not allow the user to go below 1 so it always generates a password when the Generate Password button is selected
