A rotating cube with a secret message, hover effects, and endless vibes – perfect for coders, lovers, and Gen Z chaos enthusiasts.
- 360° Infinite Rotation: Hypnotic spin powered by CSS/JS.
- Hover to Scale: Outer cube grows on hover (because drama).
- Image Gallery Cube: Each side displays custom images.
- "I Love You" Text: Subtle? Nah. Bold? Always. 💌
- Responsive Design: Works on screens and hearts.
- Clone the repo:
git clone https://github.com/Aoudumber-Bade/3D-Cube-Image-Animation.git
- Open index.html in your browser. 🎮 Usage
- Hover: Outer cube scales up (hover harder for ✨effect✨).
- Rotate Forever: Cube spins infinitely (like my thoughts at 3 AM).
- Customize: Replace side images, tweak colors, or change the message to "I Love Code".
Pro Tip: Send the live link to your crush and say, "This cube runs smoother than my rizz."
Edit these files to make it yours:
- Change images: Replace
/assetsimages (keep dimensions square!). - Adjust animation speed: Tweak
animation-durationinstyles.css. - Edit the message: Modify the "I Love You" text in
index.html.
- HTML5
- CSS3 (Animations & Transforms)
- JavaScript (For hover interactions)
- Inspired by: Sleep deprivation and CSS-Tricks.
- Cube logic: Built with pure math (and caffeine).
MIT License – do whatever, just credit me if you clone it for your crush.
Made with ❤️ by Aoudumber Bade
Tag me if you remix this!
🚀 Star this repo if you’d code this for someone!
🔗 Live Demo: https://3d-cube-dev.netlify.app/
- Fork, tweak, and PR!
- Ideas? Open an issue – let’s collab!
Why this repo?
- Coders: Learn CSS animations & transforms.
- Lovers: Literally send this as a digital love letter.
- Gen Z: Flex your "tech heartthrob" era.
(Keep the vibe fun and light – GitHub doesn’t have to be boring!) 🦄