https://github.com/machinelearningprodigy/signup
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. 🎯
https://github.com/machinelearningprodigy/signup
animation css3 html5 javascript vscode
Last synced: 11 months ago
JSON representation
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. 🎯
- Host: GitHub
- URL: https://github.com/machinelearningprodigy/signup
- Owner: machinelearningprodigy
- Created: 2024-01-08T01:40:45.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2025-02-27T06:21:49.000Z (11 months ago)
- Last Synced: 2025-02-27T08:40:26.683Z (11 months ago)
- Topics: animation, css3, html5, javascript, vscode
- Language: HTML
- Homepage: https://signup-three-ashy.vercel.app/
- Size: 1.17 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🌟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
---
## ⚙️ 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**
```bash
git clone https://github.com/machinelearningprodigy/signup.git
2. 📂 Navigate to the Project Directory
cd account-form
3. 🖥️ 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!