Skip to content

It is a simple project which features a stylish and user-friendly account creation form with interactive validation and a social panel for easy contact. Built with HTML, CSS, and JavaScript, it delivers a seamless and modern experience. 🎯

Notifications You must be signed in to change notification settings

machinelearningprodigy/signup

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

8 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🌟Account Creation Form

This project features a stylish and user-friendly account creation form with interactive validation and a social panel for easy contact. Built with HTML, CSS, and JavaScript, it delivers a seamless and modern experience. 🎯

πŸ–ΌοΈ Preview

Form Preview


βš™οΈ Features

  • 🎨 Modern UI with glassmorphism effect.
  • πŸ” Real-time Form Validation for better user experience.
  • πŸ“§ Email Validation to ensure correct email format.
  • πŸ”’ Password Match Check for secure account creation.
  • ❀️ Interactive Social Panel with direct links to your profiles.
  • πŸ–ΌοΈ Responsive Design for various devices.

πŸ› οΈ Tech Stack

  • 🌐 HTML5
  • 🎨 CSS3 (with Google Fonts and Font Awesome)
  • πŸš€ JavaScript (ES6)

πŸš€ How to Run the Project

  1. πŸ“₯ Clone the Repository
    git clone https://github.com/machinelearningprodigy/signup.git
    
  2. πŸ“‚ Navigate to the Project Directory

cd account-form

  1. πŸ–₯️ Open index.html in a browser That's it! The form should be live in your default browser. 🎯

πŸ”‘ Form Validation Rules πŸ›‘

Username: Required (cannot be blank)

Email: Must follow standard email format (e.g., user@example.com).

Password: Required and must match the confirmation password.

Confirm Password: Must match the entered password.


🎨 UI Highlights

🌌 Background: Elegant, blurred background with a modern design.

πŸ” Validation Icons: Checkmarks for success βœ… and exclamation marks for errors ❌.

πŸ”— Social Panel: Easily toggle the social panel with a floating button.


πŸ“± Responsive Design

The form layout adapts seamlessly to different screen sizes, ensuring a great experience across devices. πŸ“²


🧩 Code Overview

πŸ“„ index.html

Contains the form structure and interactive social panel.

🎨 sign.css

Manages styles, including glassmorphism effects and validation feedback.

🧠 script.js

Handles form validation, icon toggling, and social panel interactions.


🌐 Social Links

πŸ† Kaggle

πŸ™ GitHub

πŸ‘” LinkedIn

πŸ“˜ Facebook

πŸ“· Instagram


⚠️ Known Issues

πŸ”§ Ensure sign up.jpg exists in the root directory for the background image.

πŸ” Adjust social links if accounts change.


🀝 Contributing

Contributions are welcome! Feel free to fork, improve, and submit a pull request. 🌱


πŸ“œ License

πŸ†“ Free to use - Attribution appreciated but not required!

Happy Coding! ✨


πŸ› οΈ Tips:

  • Replace the placeholder image URL with a real screenshot of your form.
  • Update the GitHub repository URL if needed.
  • Ensure your background image is correctly named sign up.jpg and located in the root folder.

This README file is designed to present your project professionally while keeping it engaging with relevant emojis and clear structure. Let me know if you need more customization!

About

It is a simple project which features a stylish and user-friendly account creation form with interactive validation and a social panel for easy contact. Built with HTML, CSS, and JavaScript, it delivers a seamless and modern experience. 🎯

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published