Portfolio Work Template
The full body of work.A work page: a figure-led hero, an index and spotlight gallery pairing, a project narrative and an enquiry form — rendered entirely in your tokens.
When to use this template
A work page is judged on the work — the layout should stay quiet and let the projects carry the page.
This one is dressed in Portfolio copy and runs 7 sections, opening on the Helm navbar and closing with the Anchor footer. In between it covers hero, gallery and content.
At a glance
- Page type
- Work
- Business
- Portfolio
- Sections
- 7
- Section types
- 6
- Design tokens
- Colour, Radius, Shadow, Spacing, Typography
- Requires JS
- No
- Price
- Free
7 sections in this page
Every section below is a real, responsive layout rendered in your own design tokens — not a screenshot. In page order:
-
Helm
NavbarA floating pill bar with a full-round edge and a deep shadow, centered so it reads as detached from the page top.
-
Cameo
HeroA figure-led collage pairing copy on the left with an illustrated cut-out figure staged on the right.
-
Index
GalleryA text-forward, image-free index — each row a numbered entry with a title, caption and meta column.
-
Spotlight
GalleryA hierarchy gallery: one large featured item on the left beside a compact list of the rest.
-
Story
ContentA classic zigzag narrative — alternating rows pairing a swappable image with a block of story copy.
-
Message
ContactA form-forward contact block: one card with a name and email row, a message field and a full-width submit.
-
Anchor
FooterA minimal centered footer — a wordmark, one wrapping nav row, a divider, then copyright and social buttons.