Agency Services Template
How the work gets done.A services page: a figure-led hero, a process card grid, a sequenced feature relay, a work gallery and a testimonial split, closing on a split CTA — composed in your tokens.
When to use this template
A services page has to make an offer legible: what is included, who it suits, and what happens next.
This one is dressed in Agency copy and runs 8 sections, opening on the Bearing navbar and closing with the Anchor footer. In between it covers hero, process and features.
At a glance
- Page type
- Services
- Business
- Agency
- Sections
- 8
- Section types
- 8
- Design tokens
- Colour, Radius, Shadow, Spacing, Typography
- Requires JS
- No
- Price
- Free
8 sections in this page
Every section below is a real, responsive layout rendered in your own design tokens — not a screenshot. In page order:
-
Bearing
NavbarA balanced split bar: half the links to the left of a centered wordmark, the rest to its right beside the button.
-
Cameo
HeroA figure-led collage pairing copy on the left with an illustrated cut-out figure staged on the right.
-
Blocks
ProcessA grid of numbered step cards, each leading with a large index number above its title and text.
-
Relay
FeaturesA four-step sequence rather than parallel cells, each step a numbered icon node on a connecting track.
-
Mosaic
GalleryA masonry wall of image tiles at varied crops, each captioned beneath.
-
Anthem
TestimonialsAn aside carrying a large aggregate score and review count, beside a vertical stack of compact quote cards.
-
Split
Call to actionA horizontal call to action — heading and subcopy on the left, a solid and a ghost button on the right.
-
Anchor
FooterA minimal centered footer — a wordmark, one wrapping nav row, a divider, then copyright and social buttons.