A collection of 50+ beginner to advanced projects built using HTML, CSS, and JavaScript for learning and practice.
Live Demo: https://jamamjadalone.github.io/50-html-css-js-projects/
- 01-simple-404-page
- 02-social-media-share-icon-animation
- 03-card-with-hover-effect
- 04-button-hover-effect
- 05-share-button-using-css
- 06-social-media-icons-css
- 07-double-line-css-button-hover-effects
- 08-footer-using-html-css
- 09-image-animation-using-html-css
- 10-dropdown-menu-using-html-css
- 11-list-items-hover-effect
- 12-custom-checkbox-using-html-css
- 13-box-loading-animation-css
- 14-glassmorphism-login-form-html-css
- 15-card-image-hover-effect
- 16-dropdown-list-html-css
- 17-custom-toggle-switch-using-css
- 18-card-3d-hover-effect
- 19-name-animation-using-css
- 20-neon-light-text-effect-css
- 21-html-top-bar-slide-down-notification-css
- 22-custom-checkbox-css
- 23-css-timeline-vertical
- 24-responsive-bootstrap-navbar
- 25-the-gift-using-css
- 26-new-year-countdown
- 27-drawing-app-javascript
- 28-screen-recorder-html-css-js
- 29-image-color-picker-js
- 30-animated-tab-bar-html-css-js
- 31-notes-app-html-css-js
- 32-calendar-html-css-js
- 33-add-to-cart-button
- 34-search-filter-js
- 35-progress-steps-html-css-js
- 36-hidden-search-bar
- 37-hamburger-menu-css-js
- 38-increment-counter
- 39-toast-notification
- 40-music-player-html-css-js
- 41-speech-to-text-js
- 42-copy-to-clipboard-js
- 43-programming-quote-generator
- 44-github-profile-search
- 45-age-calculator-js
- 46-tic-tac-toe-js
- 47-javascript-drum-kit
- 48-javascript-image-slider
- 49-random-jokes-generator-js
- 50-number-guessing-game-js
- 51-speech-recognition-js
- Clone this repository:
git clone https://github.com/jamamjadalone/50-html-css-js-projects.git
- Open any project folder.
- Open the
index.htmlfile in your browser to view it.
- 51 Front-end Projects
- SEO Optimized with JSON-LD Schema
- Ready for GitHub Pages
This project is licensed under the MIT License.