Web Projects

Password Generator

A strong password generator

Astro
React
shadcn/ui
Tailwind
a map of the United States | Photo by Morgan Lane aka @themorganlane on Unsplash

Introduction

The Password Generator is a secure, user-friendly tool designed to create strong, customizable passwords. With its intuitive interface and flexible options, users can quickly generate complex passwords tailored to their specific requirements.

Features

  • Adjustable Password Length: Users can set the desired password length using a slider.
  • Character Type Customization: Users can select any combination of these options to meet various password criteria:
    • Uppercase Letters
    • Lowercase Letters
    • Numbers
    • Symbols
  • One-Click Generation: Users can instantly create a new password based on their selected preferences.
  • Password Display: The generated password is displayed in a dedicated field, making it easy to view and verify.
  • Copy Functionality: Users can quickly copy the password to their clipboard for immediate use.
  • Clean, Modern Design: The interface features a dark mode design with a navy blue background and a centrally placed generator panel, offering a sleek and professional appearance.
  • Responsive Layout: The compact, card-style layout is designed to work well on both desktop and mobile devices.
  • Accessibility: A dark/light mode toggle supports different visual preferences or accessibility needs.

Tech Stack

  • Astro: A modern web framework that allows for the creation of fast, optimized, content-driven websites, with minimal JavaScript.
  • shadcn-ui: A UI component library designed to work seamlessly with modern JavaScript frameworks.
  • Tailwind: A utility-first CSS framework for rapidly building custom designs directly in your markup.