iPhone Product Landing Page

Apple iPhone Showcase

This is a simple, interactive landing page for an iPhone product showcase.

The project simulates a product display for Apple iPhones where users can:

View a featured iPhone (image and description).

Click on different color variants (icons below the product).

When a color is selected:

The main iPhone image changes.

The background color of the website changes to match the phone's color.

️ Technologies Used

HTML5

CSS3

JavaScript (Vanilla)

Project Features

Responsive layout

Dynamic image swapping using onclick events

Background color changes with image selection

Simple and clean UI inspired by Apple

Preview

Click on the small images below the product to preview different iPhone colors and background themes.

Files

index.html – main structure

main.css – styling

app.js – JavaScript for interactivity

Images: 0.png, 1.png, 2.png, 3.png, 4.png

Author Developed by Salma Hani as part of her frontend learning journey.