diff --git a/100_projects/40-carousel-image-vanilla-js/01.avif b/100_projects/40-carousel-image-vanilla-js/01.avif
new file mode 100644
index 0000000..3c845be
Binary files /dev/null and b/100_projects/40-carousel-image-vanilla-js/01.avif differ
diff --git a/100_projects/40-carousel-image-vanilla-js/02.avif b/100_projects/40-carousel-image-vanilla-js/02.avif
new file mode 100644
index 0000000..ef18f26
Binary files /dev/null and b/100_projects/40-carousel-image-vanilla-js/02.avif differ
diff --git a/100_projects/40-carousel-image-vanilla-js/03.avif b/100_projects/40-carousel-image-vanilla-js/03.avif
new file mode 100644
index 0000000..1ae7343
Binary files /dev/null and b/100_projects/40-carousel-image-vanilla-js/03.avif differ
diff --git a/100_projects/40-carousel-image-vanilla-js/04.avif b/100_projects/40-carousel-image-vanilla-js/04.avif
new file mode 100644
index 0000000..c3a6917
Binary files /dev/null and b/100_projects/40-carousel-image-vanilla-js/04.avif differ
diff --git a/100_projects/40-carousel-image-vanilla-js/index.html b/100_projects/40-carousel-image-vanilla-js/index.html
new file mode 100644
index 0000000..3b84449
--- /dev/null
+++ b/100_projects/40-carousel-image-vanilla-js/index.html
@@ -0,0 +1,20 @@
+
+
+
+
+
+ Carousel
+
+
+
+
+
+
+
diff --git a/100_projects/40-carousel-image-vanilla-js/script.js b/100_projects/40-carousel-image-vanilla-js/script.js
new file mode 100644
index 0000000..ffb9c28
--- /dev/null
+++ b/100_projects/40-carousel-image-vanilla-js/script.js
@@ -0,0 +1,14 @@
+const imgs = document.getElementById("imgs");
+const img = document.querySelectorAll("#imgs img");
+
+let index = 0;
+
+function run() {
+ index++;
+
+ if (index > img.length - 1) {
+ index = 0;
+ }
+ imgs.style.transform = `translateX(${-index * 500}px)`;
+}
+setInterval(run, 2000);
\ No newline at end of file
diff --git a/100_projects/40-carousel-image-vanilla-js/style.css b/100_projects/40-carousel-image-vanilla-js/style.css
new file mode 100644
index 0000000..dcc6323
--- /dev/null
+++ b/100_projects/40-carousel-image-vanilla-js/style.css
@@ -0,0 +1,28 @@
+* {
+ box-sizing: border-box;
+}
+body {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: "Poppins", sans-serif;
+ margin: 0;
+ min-height: 100vh;
+ background: #E6E6FA;
+}
+.carousel {
+ box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
+ overflow: hidden;
+ height: 500px;
+ width: 350px;
+}
+.image-container {
+ display: flex;
+ transition: transform 0.5s ease-in-out;
+ transform: translateX(0);
+}
+img {
+ object-fit: cover;
+ height: 500px;
+ width: 500px;
+}
\ No newline at end of file
+ 
+ 
+ 
+