diff --git a/index.html b/index.html
new file mode 100644
index 0000000..2bd9a9d
--- /dev/null
+++ b/index.html
@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>Pass Gen</title>
+</head>
+<body style="background: black;
+    height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: greenyellow;">
+	<div class="main">
+		<p>Какие символы включать в пароль:</p>
+		<ul class="password__generate">
+			<li><input id="arr_num" type="checkbox" checked="checked"/> 0-9</li>
+			<li><input id="arr_en" type="checkbox" checked="checked"/> a-z</li>
+			<li><input id="arr_EN" type="checkbox" checked="checked"/> A-Z</li>
+			<li><input id="arr_symb" type="checkbox" checked="checked"/> !,@,#,$,%,?,-,+,=,~,[,],(,),_</li>
+		</ul>
+		<p>Количество символов в пароле: <input id="passLenght" type="number" step="1" min="4" max="128" value="16" style="
+    background: black;
+    color: greenyellow;
+"/></p>
+		<p>Сгенерированный пароль: <br>
+		<li><code id="result"></code></li>
+		<li><code id="result1"></code></li>
+		<li><code id="result2"></code></li>
+		<li><code id="result3"></code></li>
+		<li><code id="result4"></code></li>
+		<code></code></p>
+		<p><button id="pass_start" style="background: greenyellow;color: black;">Сгенерировать пароль</button></p><br>
+		<p style="color: red;">(для работы требуется javascript)</p>
+
+	</div>
+
+<script>
+let arr_num = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
+let arr_en = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
+let arr_EN = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
+let arr_symb = ['!', '@', '#', '$', '%', '?', '-', '+', '=', '~', '[', ']', '(', ')', '_'];
+
+const compareRandom = ( ) => Math.random() - 0.5;
+
+const randomInteger = ( min, max ) => Math.round(min - 0.5 + Math.random() * (max - min + 1));
+
+function generatePassword() {
+    let arr = [];
+    if (document.querySelector('#arr_num').checked) arr = arr.concat(arr_num);
+    if (document.querySelector('#arr_en').checked) arr = arr.concat(arr_en);
+    if (document.querySelector('#arr_EN').checked) arr = arr.concat(arr_EN);
+    if (document.querySelector('#arr_symb').checked) arr = arr.concat(arr_symb);
+
+    arr.sort(compareRandom);
+
+    let password = '';
+    let password1 = '';
+    let password2 = '';
+    let password3 = '';
+    let password4 = '';
+    let passLenght = document.querySelector('#passLenght').value;
+
+    for (let i = 0; i < passLenght; i++) {
+        password += arr[randomInteger(0, arr.length - 1)];
+    }
+    for (let i = 0; i < passLenght; i++) {
+        password1 += arr[randomInteger(0, arr.length - 1)];
+    }
+    for (let i = 0; i < passLenght; i++) {
+        password2 += arr[randomInteger(0, arr.length - 1)];
+    }
+    for (let i = 0; i < passLenght; i++) {
+        password3 += arr[randomInteger(0, arr.length - 1)];
+    }
+    for (let i = 0; i < passLenght; i++) {
+        password4 += arr[randomInteger(0, arr.length - 1)];
+    }
+
+    document.querySelector('#result').textContent = password;
+    document.querySelector('#result1').textContent = password1;
+    document.querySelector('#result2').textContent = password2;
+    document.querySelector('#result3').textContent = password3;
+    document.querySelector('#result4').textContent = password4;
+}
+
+document.querySelector('#pass_start').addEventListener('click', generatePassword);
+</script>
+</body>
+</html>
\ No newline at end of file
