This project is a submission for the GrowthX Club Frontend SDE assignment. The objective was to replicate a given animation using HTML, CSS, and JavaScript within a React-based framework — without using Lottie or dynamic imports.
- React (Vite)
- Tailwind CSS
- Framer Motion
- HTML + CSS + JavaScript
- Smooth transitions using Framer Motion and CSS keyframes
- No dynamic imports – all elements are instantly loaded
- Performance-optimized and re-triggerable CSS animations
- Clone the repository
git clone https://github.com/litikesh/smooth-animation-task.git
cd smooth-animation-task
- Install dependencies
npm install
- Run the development server
npm run dev
The project will be available at: http://localhost:5173
- Lottie was not used.
- No
dynamic import()
ornext/dynamic
was used. - Animation starts instantly when the page loads.