Source: https://octet-prow.app/examples/skincare-product-page

Product page example · Skincare

# Skincare product landing page example: a fragrance-free moisturiser

A product page for Quillfern, a fictional skincare brand. It says what the cream does in one sentence, then covers the routine, the ingredients, what is left out and who should patch-test first.
Page type
Product page
Canvas
Desktop · 1280 px
Sections
6
Brand
Quillfern (demo brand)
THE PAGE
Download as a free template.zip · 58 KB Open the live page ↗

## Download and usage details

Files
HTML + CSS · images included
Usage
Free to edit and use in personal and commercial projects. Attribution is optional. Do not resell or redistribute the templates themselves as templates.
Forms, if included
They look complete but do not send anything. Point the form at your own form service or email tool before you publish.
Fonts
Fonts load from Google Fonts
Demo content
Every brand is a fictional demo brand, and the copy was written for that demo. Replace product facts, offers and any testimonials with your own, and check every claim before you publish.
All templates →
01 / THE BRIEF

## What we typed

A product page for the Quillfern Barrier Cream: a 50 ml, fragrance-free moisturiser with ceramides, niacinamide and squalane. Open with one plain sentence on what it does: it helps dry, easily irritated skin hold on to moisture. Then cover: how to use it in a two-step routine (morning and night, after cleansing); what is in it and why each ingredient is there; what it leaves out (no fragrance, no essential oils, no drying alcohol); who it suits and who should patch-test first. Price: $28 for 50 ml, free shipping on orders over $35. Main action: Buy on the Quillfern store. Do not invent customer reviews, star ratings, percentages, clinical results or awards. In the footer, add one line: Quillfern is a demo brand created to show what Octet Prow can build. It is not a real company and nothing here is for sale.
02 / DESIGN SYSTEM

## Quillfern Quiet Barrier

- primary · #B98E68
- secondary · #6D7F63
- tertiary · #A9744E
- surface · #FBF7F1
- outline · #C6B8A7
- inverse · #33302A
- Serif · Fraunces
- Sans · Inter
Generated once for the project from its brief. Every page in the project follows it.
03 / STRUCTURE

## How the page is put together

- Opening A cream that helps dry, easily irritated skin hold on to moisture. What the cream does in one plain sentence, the price and the buy action.
- 01 Two steps, morning and night. The two-step routine for morning and night.
- 02 Three ingredients, and the reason each one is there. Each ingredient and the one job it does.
- 03 Three things that are not in the tube. What the formula leaves out, and why that matters for irritated skin.
- 04 Dry, easily irritated skin — and the people who have to test first. Who it suits, and who should go slowly and patch-test first.
- 05 One tube, $28, ordered from the Quillfern store. The buy block: one size, one price, shipping terms.
04 / REVIEW

## What we checked and changed

We read every line for invented facts. One sentence said a tube lasts about three months for most people, a figure we had not supplied. We asked the editor to remove it; the page now only says that very dry skin uses a little more.
MORE EXAMPLES
Product page · Home & garden Plants die because you forget to water them. → Advertorial · Sleep Why do I keep waking up hot at 3 a.m.? →
MAKE ONE LIKE THIS

## Start from your own product and the question your readers ask.

Start creating