A beautiful, responsive password generator web application with stunning gradient designs, smooth animations, and dark mode support.
- ๐จ Modern Gradient Design - Beautiful gradient text and borders throughout the UI
- ๐ Dark Mode Toggle - Seamless light/dark theme switching with persistent preference
- ๐ฑ Fully Responsive - Works perfectly on all devices (mobile, tablet, desktop)
- ๐ญ Smooth Animations - Elegant transitions and hover effects
- ๐ Secure Password Generation - Generates strong passwords with letters, numbers, and symbols
- ๐ One-Click Copy - Easy clipboard copying with visual feedback
- โ๏ธ Customizable Length - Adjustable password length (4-50 characters)
- ๐ฏ Font Awesome Icons - Professional icons for better UX
- ๐พ LocalStorage Integration - Remembers your dark mode preference
Simply open index.html in your browser to see the password generator in action!
-
Clone the repository
git clone https://github.com/akashasahu07/Password-Generator.git
-
Navigate to the project directory
cd password-generator -
Open in browser
# Simply open index.html in your preferred browser # Or use a local server
- HTML5 - Semantic markup structure
- CSS3 - Advanced styling with gradients and animations
- JavaScript (ES6) - Modern JavaScript for functionality
- Font Awesome 6.4.0 - Icon library
- LocalStorage API - Theme persistence
- Clipboard API - Copy functionality
Password-Generator/
โ
โโโ index.html # Main HTML file (single-page application)
โโโ README.md # Project documentation
โโโ screenshots/ # Screenshots folder (optional)
- Generate Password: Click the "Generate Password" button to create a random secure password
- Adjust Length: Use the number input to set your desired password length (4-50 characters)
- Copy Password: Click the copy icon next to the password field to copy it to clipboard
- Toggle Dark Mode: Click the moon/sun icon in the top-right to switch themes
- Includes uppercase letters (A-Z)
- Includes lowercase letters (a-z)
- Includes numbers (0-9)
- Includes special characters (!@#$%^&*()_+~`|}{[]:;?><,./-=)
- Desktop: > 768px
- Tablet: โค 768px
- Mobile: โค 480px
- Small Mobile: โค 360px
- Gradient backgrounds
- Gradient text effects
- Gradient borders
- Smooth transitions
- Hover animations
- Focus states
- Rotating icon animations
- Slide-in notifications
- โ Chrome (latest)
- โ Firefox (latest)
- โ Safari (latest)
- โ Edge (latest)
- โ Opera (latest)
- โ iOS (iPhone, iPad)
- โ Android (all devices)
- โ Touch-optimized interface
- โ Responsive design
Contributions are welcome! Here's how you can help:
- Fork the project
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
Your Name
- GitHub: @akashasahu07
- LinkedIn: Akasha Sahu
- Font Awesome for the beautiful icons
- Inspiration from modern web design trends
- The open-source community
- Add password strength indicator
- Include/exclude character type options (uppercase, lowercase, numbers, symbols)
- Password history feature
- Export passwords option
- Multiple password generation at once
- Password strength analyzer
- Custom character set option
If you have any questions or need help, feel free to:
- Open an issue on GitHub
- Contact me via email: akashasahu2001@gmail.com
โญ If you find this project useful, please consider giving it a star! โญ
Made with โค๏ธ by Akash


