Create a futuristic premium automotive website called “Nexo Blackline Garage”.
STYLE:
Dark cinematic UI with matte black background, red neon glow, metallic silver typography, smooth animations, realistic reflections, luxury automotive atmosphere, gaming-inspired design, modern JDM and mafia aesthetic.
OPENING INTRO:
When the website opens, play a cinematic 3D intro.
Scene starts in darkness with engine startup sound.
A realistic BMW M4 CS appears drifting through smoke at night with aggressive tire screech sounds, red glowing taillights, sparks, cinematic camera movement, rain reflections, and neon environment.
While drifting, the text “NEXO BLACKLINE GARAGE” appears in metallic glowing typography.
The drift ends with cinematic close-up shots:
- headlights
- exhaust flames
- spinning wheels
- carbon fiber details
- interior dashboard
- revving engine
Then transition smoothly into the main homepage.
MAIN HOMEPAGE:
Display all major car company logos in a futuristic grid:
BMW, Mercedes, Audi, Toyota, Nissan, Honda, Porsche, Ferrari, Lamborghini, Bugatti, Supra, McLaren, etc.
Each logo should glow on hover with cinematic animation.
When clicking a brand:
Open a premium showcase page displaying all models from that manufacturer with realistic 3D cards and specifications.
MODEL PAGE:
When selecting a car model:
Open an interactive 3D blueprint-style garage interface.
FEATURES:
- Full 3D car model
- Blueprint glowing lines
- Rotatable car
- Clickable mechanical parts
- Engine section
- Turbo
- Suspension
- Brakes
- Transmission
- Exhaust
- ECU
- Cooling system
When user clicks any part:
Show:
- part name
- function
- animations
- how it works
- maintenance tips
- modification advice
CAR BUILDER:
Allow users to:
- change rims
- body kits
- spoilers
- wraps
- headlights
- exhausts
- suspension height
- engine upgrades
- paint colors
Show live visual updates in real-time.
AI GARAGE ASSISTANT:
Add an AI assistant that gives:
- tuning advice
- modification suggestions
- performance upgrades
- realistic horsepower estimates
- beginner mechanic guidance
EXTRA FEATURES:
- cinematic transitions
- smooth scrolling
- realistic car sounds
- dark neon UI
- mobile responsive
- ultra modern animations
- user garage profiles
- save custom builds
- upload builds
- compare cars
- horsepower calculator
TECH STACK:
Use:
- React
- Next.js
- Three.js
- GSAP
- Tailwind CSS
- Framer Motion
Create the website as production-quality with premium modern UI and realistic automotive atmosphere.
Now let me install the required dependencies first, then build this epic automotive website.
Now let me build this epic automotive website. I'll start with the globals.css, layout, and then create all the components:
Now let me create the main page that brings everything together:
Let me verify the app is running correctly by checking for any errors:
The server is starting successfully. Let me use the browser to verify the app is working and see the cinematic intro:
The cinematic intro is working beautifully! I can see the drift scene with the car, glowing taillights, exhaust flames, sparks, rain effect, street lights, RPM gauge showing 8500, and speed showing 145. The "SKIP INTRO" button is visible in the corner. Let me skip the intro and capture the main homepage:
The Agent timed out. Type a new prompt to continue.