Skip to content

About

Modern, zero-dependency password generator built with vanilla HTML/CSS/JS. It uses the browser’s crypto.getRandomValues API to produce cryptographically strong passwords, surfaces real-time entropy estimates, and includes a friendly UI focused on accessibility.

Resources

Stars

1 star

Watchers

0 watching

Forks

Latest commit

 

History

8 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Secure Password Generator 🔐

Modern, zero-dependency password generator built with vanilla HTML/CSS/JS. It uses the browser’s crypto.getRandomValues API to produce cryptographically strong passwords, surfaces real-time entropy estimates, and includes a friendly UI focused on accessibility. ⚡

Password generator UI

✨ Features

  • 🔒 Cryptographically secure randomness with rejection sampling to avoid modulo bias.
  • 🎚️ Adjustable length slider (4–64) plus toggles for lowercase, uppercase, numbers, and symbols.
  • 🧩 Guaranteed inclusion of every selected character category with unbiased shuffling.
  • 📈 Real-time entropy calculation in bits and a color-coded strength meter.
  • 📋 Copy-to-clipboard button with optimistic UI feedback and keyboard focus handling.
  • 🙈 Password visibility toggle that resets on every generation for safety.
  • 💠 Fully responsive glassmorphism UI with accessible labels, ARIA live regions, and semantic HTML.

🚀 Getting Started

1. Clone or download

git clone https://github.com/<your-handle>/password-generator.git
cd password-generator

2. Open in a browser

Because this is a static site, simply open index.html in any modern browser (Chrome, Edge, Firefox, Safari). No build tools or package installs required.

3. Optional: serve locally

If you prefer running a local server (recommended for clipboard APIs in some browsers), use any static server. Example with npx serve:

npm install -g serve
serve .

Then visit the printed http://localhost:* URL.

🧠 How It Works

  • script.js defines character sets, handles secure random generation, shuffles the result, computes entropy, updates the meter, and wires up copy/visibility interactions.
  • style.css implements the responsive layout, glassmorphism aesthetic, and small animations for the copy feedback.
  • index.html provides semantic markup, ARIA attributes, and hooks for the UI controls.

🛠️ Customization Ideas

  • Adjust the entropy thresholds or labels in estimateStrength to match your policy.
  • Expand the symbol list or add preset profiles (e.g., “PIN”, “Passphrase”).
  • Hook the generator into a backend or browser extension for direct use in other apps.

🤝 Contributing

Issues, ideas, and pull requests are welcome. Please:

  • Open an issue describing the bug/feature before submitting large changes.
  • Keep dependencies lightweight—prefer native browser APIs.
  • Add inline comments where the logic could be surprising.
  • Test in at least one Chromium-based browser and one Gecko/WebKit browser.

🗺️ Roadmap

  • Export passwords as passphrases or Diceware-style words.
  • Add keyboard shortcuts (e.g., Space to regenerate, Ctrl+C to copy).
  • Dark/light theme toggle driven by prefers-color-scheme.

📜 License

This project is provided as-is; feel free to adapt it within your own repositories. If you publish a derivative, crediting the original author is appreciated but not required.

Made with love by Sohail and open contributions ❤️

About

Modern, zero-dependency password generator built with vanilla HTML/CSS/JS. It uses the browser’s crypto.getRandomValues API to produce cryptographically strong passwords, surfaces real-time entropy estimates, and includes a friendly UI focused on accessibility.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages