Skip to content

adit-ya15/spylt-milk-clone

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Spylt Milk – Animated Brand Website

A modern, animation-heavy brand website inspired by Spylt, showcasing production-grade frontend animations, smooth scroll interactions, and clean UI composition.

TL;DR

  • Animation-heavy brand website inspired by Spylt
  • Built with React + GSAP + ScrollTrigger
  • Focused on motion design and scroll storytelling
  • Fully responsive and performance-optimized

🚀 Live Demo

https://spylt-milk-clone.netlify.app/

🧠 Why this project?

Modern product and agency websites rely heavily on motion design and scroll-based storytelling.
This project focuses on visual polish, performance-friendly animations, and component structure, not just static UI.

🛠 Tech Stack

  • React.js
  • Tailwind CSS
  • GSAP
  • GSAP ScrollTrigger

✨ Key Features

  • Smooth scroll-based animations
  • Advanced GSAP timelines
  • ScrollTrigger-based section transitions
  • Clip-path and motion effects
  • Fully responsive layout
  • Clean component structure

⚙️ Performance Considerations

  • Optimized animation triggers
  • Minimal re-renders
  • Lightweight component hierarchy

📂 Project Structure

src/
├── components/
├── sections/
├── hooks/
├── styles/
└── utils/

🧪 Testing

Not included (UI-focused project)

📌 Learnings

  • Advanced GSAP usage in React
  • Scroll-based animation orchestration
  • Animation performance optimization
  • Structuring large UI-focused React apps

📸 Screenshots

image image image

📄 License

This project is for learning and demonstration purposes.

About

Animation-heavy brand website clone showcasing modern UI animations and smooth scroll interactions.

Topics

Resources

Stars

Watchers

Forks

Contributors