AAWEA.ORG
AAWEA.ORG
AAWEA.ORG

Luxury smartwatch Three.js landing page with animated sections

Luxury smartwatch Three.js landing page with animated sections
πŸ“ Prompt Template
Create one html file for a luxury smartwatch page using Three.js, Anime.js and Tailwind. Make a 3D watch model, a dark textured overlay with a round hole showing the watch on beige, and animate header and big numbers to slide in when page loads.

Make the page more professional, Replace the static hole with an iris that opens on load. Add a glass dome over the watch face with reflections, improve metal materials, add mouse parallax so watch rotates with cursor, and draw time and fitness rings on the watch face

Turn the single screen into a multi section scroll site. When user scrolls, animate the 3D watch to move and rotate to match each section. Keep the 3D canvas and background fixed while text scrolls over them, only the watch moves

- fixed canvas: position the canvas
πŸ’‘ About This Prompt

A detailed multi-step prompt sequence for Gemini 3 Pro to build a luxury smartwatch landing page using Three.js, Anime.js, and Tailwind, then refine it into a multi-section scrolling site with advanced animations and interactions.

H
Harshith
@harshith
Metadata
Published Jun 12, 2026
Model
Gemini 3 10 cr/run
Category
Portrait
0
Likes
0
Views
0
Shares
0
Comments
0
Bookmarks
0
Uses
⚑ TRY IT NOW
Share Now

0 Comments

Sign in to join the discussion
πŸ’¬
No comments yet. Be the first!

πŸ‘₯ Co-learning Circle 0

Observe other members' variables & configurations, and click "Study & Retry" to instantly import settings and practice!

πŸ‘₯
No users have run this prompt yet.
Preview