gallery.scandinavian-soft-masonry · Soft masonry

A gallery pattern from Scandinavian Soft, drawn alone below with this design's tokens and sample copy. Used in this design on: home page, section 4. Give the section root data-pattern="gallery.scandinavian-soft-masonry". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
A title at step 5 on 2–8 and a muted line on 9–11, then six rounded photos in a three-column masonry with small muted captions.
Slots
title, body, items[6..6]
Grid areas
title 2-8 · intro 9-11 · gallery full (12-column grid, 1-based inclusive spans)
Tokens
bg #FDF9F4 · text #241E16 · heading #150E06 · accent #69A382 · accent2 #5DA29C · Nunito / Nunito Sans · radius 16px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • Header row: title (h2 at step 5, weight 400) in 2–8, bottom-aligned with a muted line in 9–11. Then six rounded photographs in a three-column masonry with mixed portrait and landscape crops so the columns stagger, each with a one-line muted caption. Two columns at tablet; at phone width the photos scroll sideways in one row.

Selected work

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Corvid Robotics — identity

Fieldstack — website

Tidewater Labs — naming

Arklow — trade show

Mosswood Bio — packaging

Kestrel Freight — fleet livery