Welcome to my collection of HTML, CSS, and JavaScript mini projects! These projects helped me practice and polish my skills in frontend development. Most of them are small, single-page applications that demonstrate interactive UI components, animations, or basic logic handling — built with vanilla JS, no frameworks.
💡 One of the projects —
Note App— includes backend functionality using Flask and SQLite to demonstrate full stack development.
- HTML5
- CSS3
- JavaScript (ES6+)
- Flask (for one project)
- SQLite (for one project)
Here's a list of all the projects included in this repository:
| Project Name | Description |
|---|---|
| Age Calculator | Calculate age based on birthdate input |
| BG Img Scroll Effect | Background image changes on scroll |
| BMI Calculator | Simple BMI calculator |
| Color Generator | Random color generator |
| Digital Clock | Live digital clock using JS |
| Double Landing Page | Stylish landing page with split screen |
| Drum Kit | Interactive drum kit with sound |
| Emoji Rating | Select emoji-based feedback |
| Image Generator | Random image generator using API |
| Image Search App | Search and display images from API |
| Loading Bar | Loading animation component |
| Loan Calculator | Simple interest calculator |
| Mini Calendar | Monthly calendar UI |
| Mouse Event | Tracks and displays mouse events |
| New Year Countdown | Countdown timer to the new year |
| Persistent ToDo List | To-do list saved in localStorage |
| Profile Statistics | UI card showing profile metrics |
| Pomodoro Timer | Timer based on Pomodoro technique |
| Random Emoji Generator | Randomly shows emojis |
| Random Password Manager | Random password generator |
| Realtime Character Counter | Shows live character count |
| Recipe Book App | Fetches and displays recipes |
| Rotating Image Gallery | Image carousel with rotating effect |
| Social Media Menu | Expanding radial social menu |
| Sticky Navbar | Navbar that sticks on scroll |
| Temp Converter | Celsius <--> Fahrenheit |
| Testimonial Slider | Testimonial slider component |
| Text Effect Animation | Cool animated text effect |
| Tip Calculator | Calculates tip based on input |
| Video Trailer Popup | Click to open trailer popup |
| Weather App | Shows weather using API |
| Clock | Analog + digital clock |
| Color Flipper | Flips background colors |
| Dice Roll | Simple dice roll simulator |
| Fancy Buttons | Button animations and hover effects |
| Heart Trail Animation | Hearts follow the mouse on move |
| Note App using Flask & SQL | Full-stack app with user notes |
| Palindrome Checker | Checks if a word is a palindrome |
| Quote Generator | Displays random quotes |
| Rock Paper Scissors | Game against the computer |
| Stopwatch | Basic stopwatch with start/stop/reset |
If you like the projects, feel free to star ⭐ the repo or fork it for learning the basics yourself!