Website designFree→ v0 / Lovable
E-commerce Product Page — Modern
A product detail page with an image gallery, variant picker, and reviews.
What you get: Two-column product page: image gallery left, details + buy box right, reviews below.
Example output. A simplified example of what this prompt can produce, made by Claude from the prompt using the sample values below. Names, prices and reviews are invented, and your result will differ with your own values and the tool you use.
- product_name:
- Ridge Trail Pack 28L
- product_category:
- daypack
- price:
- 129
- image_count:
- 4
- variant_type:
- colour
- accent_color:
- emerald green
Design a product page for {{product_name}} (a {{product_category}} priced at ${{price}}).
Layout: two columns on desktop, stacked on mobile.
Left: a large image with {{image_count}} thumbnails below it that swap the main image on click.
Right: product name, price, star rating + review count, a short description, a {{variant_type}} picker (e.g. size/color swatches), quantity selector, and a prominent "Add to cart" button.
Below both columns: a tabbed section for Description / Specs / Reviews, and a "You might also like" row of 4 related products.
Style: clean, lots of product photography, {{accent_color}} for the buy button and price. Use Tailwind CSS.