diff --git a/imageSlider/purnasth/index.html b/imageSlider/purnasth/index.html
new file mode 100644
index 000000000..4240137fc
--- /dev/null
+++ b/imageSlider/purnasth/index.html
@@ -0,0 +1,58 @@
+
+
+
+
+
+ Infinite Scroll Animation - Purna Shrestha
+
+
+
+ Welcome to Nepal
+
+
+
+
+
+
+
+
diff --git a/imageSlider/purnasth/main.js b/imageSlider/purnasth/main.js
new file mode 100644
index 000000000..3f0fab3ec
--- /dev/null
+++ b/imageSlider/purnasth/main.js
@@ -0,0 +1,20 @@
+const scrollers = document.querySelectorAll(".scroller");
+
+if (!window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+ addAnimation();
+}
+
+function addAnimation() {
+ scrollers.forEach((scroller) => {
+ scroller.setAttribute("data-animated", true);
+
+ const scrollerInner = scroller.querySelector(".scroller__inner");
+ const scrollerContent = Array.from(scrollerInner.children);
+
+ scrollerContent.forEach((item) => {
+ const duplicatedItem = item.cloneNode(true);
+ duplicatedItem.setAttribute("aria-hidden", true);
+ scrollerInner.appendChild(duplicatedItem);
+ });
+ });
+}
diff --git a/imageSlider/purnasth/style.css b/imageSlider/purnasth/style.css
new file mode 100644
index 000000000..04a5b93ce
--- /dev/null
+++ b/imageSlider/purnasth/style.css
@@ -0,0 +1,111 @@
+:root {
+ --clr-primary-100: #e6f6ff;
+ --clr-primary-200: #b3e0ff;
+ --clr-primary-300: #80cfff;
+ --clr-primary-400: #4db9ff;
+ --clr-primary-500: #1a9fff;
+ --clr-primary-600: #007acc;
+ --clr-primary-700: #005499;
+ --clr-primary-800: #003266;
+ --clr-primary-900: #001833;
+}
+
+body {
+ display: grid;
+ /* min-block-size: 100vh; */
+ place-content: center;
+ font-family: system-ui;
+ font-size: 1.125rem;
+ background-color: var(--clr-primary-900);
+ overflow-x: hidden;
+}
+
+h1 {
+ font-size: 2.5rem;
+ font-weight: 700;
+ color: var(--clr-primary-100);
+ text-align: center;
+}
+
+.tag-list {
+ margin: 0;
+ padding-inline: 0;
+ list-style: none;
+}
+.image-list {
+ padding-inline: 0;
+ /* width: clamp(300px, 100%, 1500px); */
+ max-width: 1500px;
+ width: min(100vw, 1500px);
+}
+
+.tag-list li {
+ padding: 1em;
+ background: var(--clr-primary-200);
+ border-radius: 0.5em;
+ box-shadow: 0 0.5rem 1rem -0.25rem var(--clr-primary-700);
+}
+.image-list img {
+ width: 200px;
+ height: auto;
+ object-fit: cover;
+ border-radius: 0.5em;
+ box-shadow: 0 0.5rem 1rem -0.25rem var(--clr-primary-700);
+ cursor: pointer;
+}
+.scroller {
+ margin: 0 auto;
+}
+
+.scroller-text {
+ max-width: 600px;
+}
+
+.scroller__inner {
+ padding-block: 1em;
+ display: flex;
+ flex-wrap: wrap;
+ gap: 1em;
+}
+
+.scroller[data-animated="true"] {
+ overflow: hidden;
+ -webkit-mask: linear-gradient(
+ 90deg,
+ transparent,
+ var(--clr-primary-100) 20%,
+ var(--clr-primary-100) 80%,
+ transparent
+ );
+ mask: linear-gradient(
+ 90deg,
+ transparent,
+ var(--clr-primary-100) 20%,
+ var(--clr-primary-100) 80%,
+ transparent
+ );
+}
+.scroller[data-animated="true"] .scroller__inner {
+ flex-wrap: nowrap;
+ animation: scroll var(--_animation_duration, 40s)
+ var(--_animation-direction, forwards) linear infinite;
+}
+
+.scroller[data-direction="right"] {
+ --_animation-direction: reverse;
+}
+.scroller[data-direction="left"] {
+ --_animation-direction: forwards;
+}
+.scroller[data-speed="slow"] {
+ --_animation-duration: 20s;
+}
+.scroller[data-speed="fast"] {
+ --_animation-duration: 120s;
+}
+
+@keyframes scroll {
+ to {
+ transform: translate(calc(-50% - 0.5rem));
+ }
+}
+ 
+ 
+ 
+ 
+