A beautiful, interactive 3D Valentine's desktop website featuring a custom Three.js scene, Valentine's card, and smooth animations. Built with React, Three.js, @react-three/fiber, Framer Motion, and React Scroll Motion.
- 🎨 3D Valentine's Scene using Three.js
- 💌 Valentine's Card for that special person
- 🎭 Framer Motion Animations for smooth transitions
- 🔄 Scroll-based Effects for immersive interaction
- React (Frontend framework)
- Three.js (3D rendering engine)
- @react-three/fiber (React wrapper for Three.js)
- @react-three/drei (Helpers for Three.js)
- Framer Motion (Animation library)
- React Scroll Motion (Scroll-based animations)
- Clone the Repository
git clone https://github.com/IsaacJ60/valentines.git
cd valentines- Install Dependencies
npm install- Run the Project
npm start- Open in Browser
http://localhost:3000
- Open the website.
- Scroll through text and submit user information
- Interact with questions, and the three.js model!
Custom styles are written in css files found in src\pages\[PAGE_NAME]. Modify these files to customize UI elements, colors, or animations.
- Add music for a romantic experience 🎶
- Add more interactions with the 3D model
- Improve mobile responsiveness 📱
- Built with 💖 by Isaac Jiang
- Powered by React & Three.js
This project is open-source and available under the MIT License.
