CSS Image Track is a smooth image slider built using only HTML and CSS.

I made this as a small challenge for myself: build a clean sliding image track without touching JavaScript.

Tech Stack

HTML · CSS

Live Demo

https://polite-twilight-82e0a6.netlify.app/

Overview

The idea was to practice layout and motion fundamentals using only CSS. No libraries, no frameworks, just structure + styling.

I focused on keeping the animation smooth, the spacing balanced, and the component easy to drop into any static page.

What I Learned

  • Small CSS decisions (timing, easing, spacing) make a big difference in perceived quality.
  • Building without JavaScript forces cleaner thinking about structure.
  • Responsive behavior is easier to manage when the base layout is simple.

Next Steps

  • Add keyboard-friendly controls.
  • Add optional captions and image metadata.
  • Create a second version with touch drag support.