An interactive gallery featuring iconic scenes from my favorite anime series, built with React and Framer Motion. Each title reveals three carefully chosen scenes with dynamic animations and mouse-tracked motion effects.
React
TypeScript
Framer Motion
Tailwind CSS
Vite
- Spring physics for natural feeling animations
- Each title reveals three iconic scenes when hovered
- Scenes respond to mouse movement with parallax effects
- Adapts to different screen sizes with mobile warnings
I've been on a mission to make something fun with my favorite anime scenes. Most galleries felt static, so I wanted to create something that felt alive. Started simple with React and built up the interactions. When you hover over a title, it smoothly reveals iconic moments from that series. Added some mouse tracking magic with Framer Motion to make the scenes feel more dynamic, like they're floating in space. Sure, it may not be perfect on phones (desktop is where it shines), but I'm pretty happy with how the animations turned out!
- Clone the repository
- Install dependencies:
npm install
- Run development server:
npm run dev
- Open
http://localhost:5173
in your browser