🚀 100 Days Of Code - 100 Mini Projects | HTML CSS JavaScript
One Day, One project, One New skill. Krrish To full E-commerce Till Life.
Repo: HTML-CSS-JS-MINI-PROJECTS-DAY-100-OF-CODE
Owner: Chirag Kiran Shah
Started: 15 Sep 2026 | Location: Virar, Maharashtra
📌 Live Project Links - Day 1 to 10
Day
Project
Code
01
Krrish Character - Plane Rescue
Code
02
Typewriter Effect
Code
03
3D Tilt Card
Code
04
Custom Cursor
Code
05
Glowing Button Hover
Code
06
Parallax Scroll Effect
Code
07
Counter App
Code
08
Color Flipper
Code
09
Responsive Navbar
Code
10
Digital Clock
Code
🗺️ COMPLETE ROADMAP - DAY 1 TO DAY 100 🔰 PHASE 1: Basics & DOM (Day 01-20)
Day
Project Name
What You Will Learn
Day 01
Krrish Saves Plane Animation CSS Keyframes, transform, JS click event
Day 02
Typewriter Effect
setInterval, substring
Day 03
3D Tilt Card on Mouse Move
perspective, preserve-3d
Day 04
Custom Cursor - Krrish Logo
cursor: none, mousemove
Day 05
Glowing Neon Button
box-shadow, transition
Day 06
Parallax Scroll
background-attachment: fixed
Day 07
Counter App
DOM manipulation
Day 08
Background Color Flipper
Math.random()
Day 09
Responsive Navbar + Hamburger
Flexbox, Media Queries
Day 10
Digital Clock
new Date(), setInterval
Day 11
Calculator
eval logic, grid
Day 12
Todo List App
localStorage, CRUD
Day 13
Quiz App
Object, score logic
Day 14
Weather Card UI
Glassmorphism
Day 15
Image Slider / Carousel
translateX
Day 16
Iron Man Arc Reactor
Pure CSS animation
Day 17
Avengers Logo Animation
SVG / CSS shapes
Day 18
Glassmorphism Profile Card
backdrop-filter: blur()
Day 19
Neumorphism Dashboard
box-shadow inset/outset
Day 20
Spiderman Web Shooter Effect
mousemove + canvas
⚡ PHASE 2: CSS Mastery & Animation (Day 21-40)
Day
Project Name
What You Will Learn
Day 21
Krrish Mask Loader
CSS loader
Day 22
Bouncing Ball Physics
@keyframes bounce
Day 23
Falling Aeroplane
translateY + rotate
Day 24
Flying Hero (Krrish)
Sprite animation
Day 25
Smoke Effect
blur + animation-delay
Day 26
Rock Paper Scissors UI
JS game logic
Day 27
Tic Tac Toe Game
Win condition
Day 28
Memory Flip Card Game
flip, match logic
Day 29
3D Cube Rotation
transform-style
Day 30
3D Flip Login Form
rotateY(180deg)
Day 31
Solar System - Pure CSS
orbit animation
Day 32
Heart Like Animation
Instagram like effect
Day 33
Search Bar Animation
Expanding search
Day 34
Scroll Progress Bar
scroll event
Day 35
Sticky Notes App
contenteditable, drag
Day 36
Password Generator
Math.random + charset
Day 37
Notes App with localStorage
CRUD + storage
Day 38
Expense Tracker
Array reduce
Day 39
BMI Calculator
Formula logic
Day 40
Age Calculator
Date calculation
🌐 PHASE 3: JavaScript + APIs (Day 41-65)
Day
Project Name
API / Concept
Day 41
Weather App - Live
OpenWeather API, fetch
Day 42
Movie Search App
OMDB API
Day 43
GitHub Profile Finder
GitHub API
Day 44
Dictionary App
Dictionary API
Day 45
Random Joke Generator
Joke API
Day 46
Drag & Drop Kanban Board
Drag API
Day 47
Music Player
Audio API
Day 48
Custom Video Player
Video controls
Day 49
Voice to Text App
Web Speech API
Day 50
QR Code Generator
QR API
Day 51
Form Validation
Regex
Day 52
Infinite Scroll
Intersection Observer
Day 53
Autocomplete Search
Filter logic
Day 54
Captcha Generator
Canvas
Day 55
Currency Converter
Exchange API
Day 56
Stopwatch & Timer
setInterval
Day 57
OTP Input Field
Focus logic
Day 58
File Upload Drag & Drop
FileReader
Day 59
Image Editor - Filters
CSS filters via JS
Day 60
Text to Speech
SpeechSynthesis
Day 61
Netflix Landing Page Clone
Flexbox + Grid clone
Day 62
Spotify UI Clone
Music UI
Day 63
Zomato/Swiggy Hero Section
Landing page
Day 64
Apple iPhone Scroll Animation
Scroll + sticky
Day 65
Instagram Story Viewer
Story logic
🔥 PHASE 4: Clones & Games (Day 66-85)
Day
Project Name
Day 66
E-commerce Product Page
Day 67
Shopping Cart Logic
Day 68
Instagram Like, Comment System
Day 69
Chat App UI - Frontend
Day 70
WhatsApp Web Clone UI
Day 71
Facebook Post Clone
Day 72
Portfolio Website V1
Day 73
Resume Generator
Day 74
Snake Game - JS
Day 75
Flappy Bird Game
Day 76
Brick Breaker Game
Day 77
2048 Game Logic
Day 78
Whack-a-Mole Game
Day 79
Typing Speed Test
Day 80
Wordle Clone
Day 81
Tetris - Basic
Day 82
Simon Says Game
Day 83
Maze Solver Visualizer
Day 84
Whiteboard - Canvas Drawing
Day 85
Meme Generator
👑 PHASE 5: Final Boss (Day 86-100)
Day
Project Name
Level
Day 86
Full Todo App with Dark Mode + Categories
Pro
Day 87
Movie Ticket Booking UI + LocalStorage
Pro
Day 88
Full E-commerce Frontend
Pro
Day 89
Crypto Price Tracker - Live API
Pro
Day 90
Recipe Finder App
Pro
Day 91
Blog Website UI
Pro
Day 92
Dashboard - Analytics UI
Pro
Day 93
ChatGPT Clone UI
Pro
Day 94
LinkedIn Clone Feed UI
Pro
Day 95
YouTube Clone UI
Pro
Day 96
Krrish Universe - Superhero Website
Custom
Day 97
Iron Man vs Krrish - Fight Animation
Custom
Day 98
Avengers Endgame Portal Effect
Custom
Day 99
Personal Brand Website
Custom
Day 100
MEGA PORTFOLIO - All 99 Projects Link FINAL
