Password Generator

Hello guys, today we are going to share the source code for the password generator.

You can using the source code we share and make a password generator yourself.

This password generator can generate a password that contain the numbers, letters, and symbols so that you can use the password generate yourself to keep you online account safety.

We are going to share the source code now.

As usually, we need the html extension flle to wrtting our code. This is our HTML code.

<div class="wrapper"> <h1>PASSOWORD GENERATOR</h1> <input type="text" name="" placeholder="Create password" id="password" readonly> <button onclick="genPassword()" class="gen"> GENERATE </button> <BUTTON onclick="copyPassword()"> COPY PASSWORD </button> </div>

As you can see, it's very short.

Now for the CSS code:

body{ min-height: 100vh; background: #40A9FF; display: flex; justify-content: center; align-items: center; } .wrapper{ background: #FFF; text-align: center; border-radius: 15px; padding: 20px; display: flex; justify-content: center; align-items: center; flex-direction: column; width: 85%; } input{ width: 75%; height: 45px; outline: none; border-radius: 5px; background: #FFF; border: 1px solid #40A9FF; text-align: center; color: #565666; } button{ width: 75%; height: 45px; border-radius: 5px; background: #0076FF; border: none; color: #FFF; } button.gen{ margin-top: 30px; margin-bottom: 30px; }

Our Generator is almost done. Now, We need to add the js inside the html or you can create another js file. Here is the code we should use :

var password=document.getElementById("password"); function genPassword() { var chars = "0123456789abcdefghijklmnopqrstuvwxyz!@#$%^&*()ABCDEFGHIJKLMNOPQRSTUVWXYZ"; var passwordLength = 12; var password = ""; for (var i = 0; i <= passwordLength; i++) { var randomNumber = Math.floor(Math.random() * chars.length); password += chars.substring(randomNumber, randomNumber +1); } document.getElementById("password").value = password; } function copyPassword() { var copyText = document.getElementById("password"); copyText.select(); document.execCommand("copy"); }

That is all the tutorial today, if you are facing any problem, contact me using the comment below or go to contact us