Beginnner to Advanced Web Developmemnt Projects | HTML CSS JavaScript Projects with Source Code Collection
A curated list of web development projects using HTML, CSS, and JavaScript from CodeWithCurious and FoolishDeveloper.
Platform | Discount Offer | Link |
---|---|---|
GeeksforGeeks | 35% OFF | GeeksforGeeks |
Coding Ninjas | 10% OFF | Coding Ninjas |
KodeKloud | 60% OFF | KodeKloud |
SkillShare | 50% OFF | SkillShare |
Educative | 50% OFF | Educative |
W3Schools | 20% OFF | W3Schools |
EDX | 30% OFF | EDX |
DataCamp | 50% OFF | DataCamp |
Target Test Prep | 30% OFF | Target Test Prep |
💡 Save big on top coding platforms with these exclusive discounts!
Explore various projects built using HTML, CSS, and JavaScript. These projects are categorized into different skill levels and types.
- Rock Paper Scissor Game
- Color Guessing Game
- Amazing Love Puzzle
- Snake Game
- Flappy Bird
- Pong Game
- Maze Game
- Word Scramble Game
- Rock Paper Scissor Game Using HTML, CSS, and JavaScript
- Color Guessing Game Using HTML, CSS, and JavaScript
- Snake Game Using HTML, CSS, and JavaScript
- Flappy Bird Using HTML, CSS, and JS
- Tic Tac Toe Game Using HTML, CSS, and JavaScript
- Simple Number Guessing Game in JavaScript (Free Code)
- How to Create a Snake Game In JavaScript (Free Code)
- Number Guessing Game
- Coin Flip Game
- Quiz App
- Ticket Management System
- Student Registration Dashboard
- Music Player Using HTML, CSS, and JavaScript
- Expense Tracker App Using HTML, CSS, JavaScript & React JS
- Recipe Finder App Using HTML, CSS, JavaScript & React JS
- E-commerce App Using HTML, CSS, JavaScript & React
- QR Code Generator Using HTML, CSS, and JavaScript
- Weather App
- To-Do Manager
- Library Management System
- E-commerce Website
- Responsive Registration Form
- Responsive Navigation Menu Bar
- Simple Login and Registration Form
- QR Code Generator Using JavaScript & CSS (Free Code)
- Aspect Ratio Calculator Using HTML, CSS, and JavaScript
- How to Create Stopwatch using HTML CSS JavaScript
- How to Detect User Browser
- How to Create JavaScript Password Generator
- How to Create a Word Counter
- Random Quote Generator
- Simple Loan Calculator
- Todo List
- Height Converter
- Image Upload with Preview
- Countdown Timer
- Stopwatch
- Facebook Clone
- Spotify Clone
- Facebook Login
- Facebook Clone Using HTML, CSS, and JS
- Spotify Clone Using HTML, CSS, and JS
- Netflix Clone Using HTML, CSS & JavaScript
- Amazon Clone Using HTML and CSS
- YouTube Thumbnail Downloader Using HTML, CSS, and JavaScript
- Word Counter Website
- Responsive Sign In & Sign Up Form
- YouTube Thumbnail Downloader
- Create Simple Website Using HTML and CSS
- BMI Calculator Using HTML, CSS & JavaScript
- To-Do List Using HTML, CSS and JS
- Notes App Using HTML, CSS, and JavaScript
- Word Counter Website Using HTML, CSS, and JavaScript
- Simple Calculator
- To-Do Manager
- Countdown Timer
- Digital Countdown
- Simple Feedback Form
- Simple Vertical Navigation Menu
- Skeuomorphism Button
- Simple 3D Button
- Simple Button Hover Effects
- Simple Calculator
- To-Do Manager
- Countdown Timer
- Digital Countdown
- Simple Feedback Form
- Simple Vertical Navigation Menu
- Skeuomorphism Button
- Simple 3D Button
- Simple Button Hover Effects
- Simple Transparent Login Form
- How to Make a Basic Calculator
- Responsive Image Gallery
- Simple Navigation Bar with Tooltip
- Our Team Section Design
- Animated Skills Bar
- How to Change Selected Text Background Color in CSS
- How to Create Pulse Animation Using CSS (Code + Demo)
- Simple Rainbow Text Animation Using CSS (Free Code)
- Simple Social Media Icons Hover Effect with CSS
- Simple CSS Gradient Button Animation (Tutorial + Free Code)
- How to Create a Custom Toggle Switch Using HTML CSS
- Simple 3D Button With HTML and CSS (Code + Demo)
- How To Create Custom Radio Button Using HTML CSS
- How to Create a Gradient Border in HTML & CSS
- Simple CSS Tab Bar with Animation (Tutorial + Code)
- Simple 3D Text Animation Effects using HTML & CSS
- Simple Loading Animation using HTML & CSS (Free Code)
- Simple Button Hover Effects using HTML & CSS (Free Code)
- Pulsing Heart Animation Using HTML and CSS
- Floating Social Media Icons using HTML CSS
- Text Typing Animation Effect Using HTML, CSS, and JavaScript
- Simple JavaScript Audio Player
- How to Create a Countdown Timer
- Simple Image Magnifier
- How to Create a Digital Clock
- Simple Character Counter
- Background Color Switcher
- Show and Hide Password
- Simple Weather App
- Day and Night Mode Toggle
- JavaScript Copy to Clipboard
- Show/Hide Password
- Digital Clock
- Simple JavaScript Calculator
- Responsive Music Player
- Responsive Restaurant Website
- Finance Website
- Student Registration Dashboard
- Responsive Restaurant Website Using HTML, CSS & JavaScript
- Student Registration Dashboard Using HTML, CSS, and JavaScript
- Interactive Login and Registration Form Using HTML, CSS & JavaScript
- Finance Website Using HTML, CSS & JavaScript
- Dynamic Interactive Calculator Using HTML, CSS & JavaScript
- Weather App
- Responsive Testimonial Slider
- Expanding Search Bar
- Popup Registration Form
- Popup Contact Form
- Accordion Image Gallery
- 3D Flip Card
- Glassmorphism Profile Card
- Weather App
- Responsive Testimonial Slider
- Expanding Search Bar
- Popup Registration Form
- Popup Contact Form
- Accordion Image Gallery
- 3D Flip Card
- Glassmorphism Profile Card
- 3D Cube Image Slider
- Image Lightbox & Gallery
- Floating Social Media Icons
- Automatic Popup Window
- Blog Post Card Design
- Circular Progress Bar
- Text Typing Animation
- Skeleton Screen Loading Animation
- BMI Calculator Using JavaScript
- Neumorphism Login Form UI Design Using HTML and CSS
- Circular Progress Bar Using HTML and CSS
- Responsive Top Navigation Menu Bar Using HTML & CSS
- How To Create Drop Down Menu In HTML and CSS
- How To Create Pagination Using HTML and CSS
- Simple Image Hover Effects in HTML & CSS
- Gradient Button Animation Effects using CSS
- Simple Vertical Navigation Menu Using HTML & CSS
- Accordion Image Gallery with HTML & CSS (Free Code)
- Responsive Navigation Menu Bar in HTML and CSS
- Responsive Checkout Form using HTML CSS (Free Code)
- Responsive Image Gallery using HTML and CSS
- Automatic Multiple Image Slider in HTML CSS
- Circular Progress Bar using HTML, CSS and JavaScript
- How To Create A Calculator Using HTML, CSS, and JavaScript
- Build a Simple Digital Clock with JavaScript, HTML and CSS
- How to Create a Virtual Keyboard
- How to Zoom Image on Scroll
- Draggable Div Element
- Custom Right Click Context Menu
- Responsive Counter Up Animation
- Drag and Drop Elements
- How to Create a Palindrome Checker
- How to Detect Enter Key Press
- Random Joke Generator
- Gradient Color Generator
- Random Password Generator
- Expanding Card
- JavaScript Age Calculator
- Word Counter
- Ticket Management System
- Real-Time Chat Application Using HTML, CSS & JavaScript
- Task Manager Using HTML, CSS & JavaScript
- News App Using HTML, CSS, and JavaScript
- Speech to Text Converter Using HTML, CSS, and JavaScript
- Currency Converter Using HTML, CSS, and JavaScript
- E-commerce Website
- Library Management System
- Personal Portfolio Website
- Animated Login Form Design
- Skeleton Loading Animation
- Automatic Multiple Image Slider
- Automatic and Manual Image Slider
- 3D Image Slider with Carousel
- Neumorphism Sidebar Menu
- Fullscreen Overlay Navigation Menu
- Dropdown Navigation Menu
- Animated Search Bar
- How To Make 3D Flip Card Using HTML and CSS
- Responsive Vertical Timeline Using HTML & CSS
- Responsive Automatic Image Slider in HTML CSS
- How To Create a Bottom Navigation Bar HTML CSS
- Animated Hamburger Menu using HTML CSS (Free Code)
- Popup Registration Form in HTML CSS (Code + Demo)
- Expanding Search Bar Using HTML CSS (Code + Demo)
- Skeuomorphism Button Using HTML & CSS (Free Code)
- Simple Paper Folding Effect Using CSS (Free Code)
- Smooth Background Image Zoom Using CSS (Free Code)
- Responsive Personal Portfolio Website Using HTML, CSS, JavaScript
- Sidebar Menu Using HTML, CSS & JavaScript
- Custom Range Slider using HTML CSS & JavaScript
- Responsive Sidebar Menu using HTML CSS and JavaScript
- Create A Custom Video Player using JavaScript & HTML
- Image to PDF Converter
- Save Textarea Text to a File
- Days Between Two Dates
- How to Make RGB Color Generator
- File Upload with Progress Bar
- Drawing App
- Music Player
- Step Progress Bar
- Alarm Clock
- Responsive Sign In & Sign Up Form
- Facebook Login
- Responsive Sign In & Sign Up Form Using HTML, CSS, and JS
- Facebook Login Using HTML, CSS & JS
- Student Registration Dashboard Using HTML, CSS, and JavaScript
- Login and Registration Form
- Responsive Checkout Form
- Popup Registration Form
- Responsive Contact Us Form
- Simple Registration Form
- Email Subscription Form
- Popup Login Form
- Glassmorphism Login Form
- Neumorphism Login Form
- Popup Contact Form using HTML and CSS (Free Code)
- Login Form with Floating Label using HTML & CSS
- JavaScript Confirm Password Validation with HTML & CSS
- Show-Hide Password Toggle in JavaScript (Free Code)
- Login and Registration Form using HTML and CSS
- How to Create Modal Popup in React JS
- How To Create a Modal Popup using JavaScript
- Registration Form with JavaScript Validation
- How to Check Password Strength
- Email Validation
- OTP Input Field
- Login & Registration Form
Cool CSS effects, animations, and interactive UI elements.
- Simple Snowfall Animation
- Gradient Border Animation
- 3D Text Animation
- Pulse Animation
- Animated Social Media Buttons
- Pure CSS Flip Card On Hover
- Custom Toggle Switch
- Simple Profile Card UI
- How To Create An FAQ Accordion Menu Using Only HTML & CSS
- How to Create Animated Background using CSS
- How to Create Neon Animation Light Button using HTML and CSS
- 3D Social Media Buttons Using Simple HTML and CSS Code
- Simple Feedback Form in HTML CSS (Code + Demo)
- Responsive Testimonial Slider HTML CSS (Code + Demo)
- How To Create Pop Up Login Form Using HTML and CSS
- Amazing Neumorphism Social Media Button Using HTML & CSS
- Create a Custom Tooltip Using HTML & CSS (Free Code)
- How to Create an Image Slider in React JS
- Drag and Drop Sortable List in React JS
- 5 Star Rating System Using HTML and CSS (Free Code)
- Animated Social Media Buttons using HTML & CSS
- Glassmorphism Profile Card Design using HTML and CSS
- 3D Cube Image Slider using HTML & CSS
- Image Lightbox & Gallery using HTML CSS
- Image Comparison Slider using HTML, CSS and JavaScript
- Accordion Menu
- Sidebar Dropdown Menu
- Price Range Slider
- Image Zoom on Hover
- Holi Fluid Animation Using HTML, CSS, and JavaScript
- Text Typing Animation Using HTML, CSS, and JavaScript
- Skeleton Loading Animation using HTML & CSS
- Button Ripple Effect using HTML, CSS & JavaScript
- How To Make an Animated Search Bar using HTML CSS
- Glowing Digital Clock Using HTML, CSS & JavaScript
- Animated Accordion Menu using HTML, CSS & JavaScript
- Animated Eyes Follow Mouse Cursor
- Simple Mouse Cursor Effects
- Simple Rain Animation Effects
- AI Image Generator Using HTML, CSS, and JavaScript
- Text Typing Animation
- Random Gradient Generator
- Flashlight Effect
- Neon Button Animation
- 20+ Button Click Effect CSS (Code + Demo)
- 12+ JavaScript Show Hide Password (Code + Demo)
- 30+ CSS Profile Card Design (Code + Demo)
- 12+ JavaScript Show Hide Password (Code + Demo)
- 10+ Animated Right Arrow CSS (Code + Demo)
- 10+ CSS Heart Loading Animation (Demo + Code)
- 12+ CSS Image Hover Effects (Free Code + Demo)
- Circle Animation CSS & HTML (Step by Step)
- 20+ CSS Text Typing Animation Effects (Code + Demo)
- 20+ JavaScript Background Effects (Demo + Free Code)
- 20+ CSS Animated Backgrounds Effects (Code + Demo)
- 12+ CSS Rain Effect | Simple Rain Animation Effect
- 30+ CSS Profile Card Design (Code + Demo)
- 20+ Horizontal Timeline CSS (Code + Demo)
- 20+ Circular Navigation Menu (Code + Demo)
- 12+ Best CSS 3D Text Effects (Code + Demo)
- 20+ Best CSS Confetti Animation (Free Code + Demo)
- 20+ CSS Heartbeat Animation (Code + Demo)
- 20+ CSS Wave Animation (Code + Demo)
- 10+ Animated Bubbles Background CSS (Code + Demo)
- 12+ CSS Rain Effect | Simple Rain Animation Effect
- 20+ CSS Animated Backgrounds Effects (Code + Demo)
🔗 Follow for More
For more such tutorials and free project codes, visit:
👉 CodeWithCurious.com
📺 YouTube
📷 Instagram