# Office S&M, Gallery

Creative studios · Gallery · Webflow · London, UK
Live page: https://www.officesandm.com/work
On Designly: https://designly.sh/s/office-s-m/work · JSON: https://designly.sh/s/office-s-m/work?format=json
Site: [Office S&M](https://designly.sh/s/office-s-m?format=md) (https://www.officesandm.com)
Styles: type-led, minimal, editorial, light

## Why it works

Large Osm 5 type and pill-shaped buttons give this portfolio a structured, editorial feel. A grid of project cards uses high-contrast black text on white to keep the focus on the photography, while soft amber accents provide a subtle warmth to the navigation.

## Sections, top to bottom

1. [Navigation: "Navigation"](https://designly.sh/s/office-s-m/work#section-1) (y 0–126px of 5985) · image: https://designly.sh/media/captures/cap_a56f98b2079b4473a4936180ac29c14b/sections/0.webp · id sec_0f07dce1223642158250837f18467933
2. [Content: "Content"](https://designly.sh/s/office-s-m/work#section-2) (y 126–277px of 5985) · image: https://designly.sh/media/captures/cap_a56f98b2079b4473a4936180ac29c14b/sections/1.webp · id sec_49b878c05a704267a258ba2ac58712ca
3. [Content: "Content"](https://designly.sh/s/office-s-m/work#section-3) (y 309–5450px of 5985) · image: https://designly.sh/media/captures/cap_a56f98b2079b4473a4936180ac29c14b/sections/2.webp · id sec_00ab7fa12c964772a059f980777941ac
4. [Footer: "Footer"](https://designly.sh/s/office-s-m/work#section-4) (y 5518–5985px of 5985) · image: https://designly.sh/media/captures/cap_a56f98b2079b4473a4936180ac29c14b/sections/3.webp · id sec_34f35787e6164357897293d393a1b14a

## Design tokens

- Colours: #FFFFFF (background), #000000 (text), #EECA64 (accent), #002EFF (muted)
- Fonts: Osm 5 (display), Domus (body)
- Corner radius: 9999px
- Section padding: 48px
- Export: https://designly.sh/s/office-s-m/work?format=tokens.css · https://designly.sh/s/office-s-m/work?format=tokens.json · https://designly.sh/s/office-s-m/work?format=tokens.tailwind.css

## Images

- Desktop (1440×5985): https://designly.sh/media/captures/cap_a56f98b2079b4473a4936180ac29c14b/desktop.webp
- Mobile (390×8000): https://designly.sh/media/captures/cap_a56f98b2079b4473a4936180ac29c14b/mobile.webp
- Captured: 2026-10-26

## Other Pages of Office S&M

- [Home](https://designly.sh/s/office-s-m?format=md) — /
- [About](https://designly.sh/s/office-s-m/about?format=md) — /about
- [Contact](https://designly.sh/s/office-s-m/contact?format=md) — /contact
- [Services](https://designly.sh/s/office-s-m/services?format=md) — /services

## Related

- [Studio Weave, Gallery](https://designly.sh/s/studio-weave/projects/south-barn?format=md) — Creative studios · Gallery · Custom code · London, UK · styles: editorial, minimal, photo-led, light · image: https://designly.sh/media/captures/cap_101b6ff81401428c85c63f73540171a4/desktop.webp
- [Studio Weave, Gallery](https://designly.sh/s/studio-weave/projects?format=md) — Creative studios · Gallery · Custom code · London, UK · styles: minimal, type-led, photo-led, airy · image: https://designly.sh/media/captures/cap_8c87b4df393d4a2aadf89527f6ab81a5/desktop.webp
- [Studio Ashby, Gallery](https://designly.sh/s/studio-ashby/projects?format=md) — Creative studios · Gallery · Custom code · London, UK · styles: editorial, photo-led, minimal, serif · image: https://designly.sh/media/captures/cap_da44b13a9dc54600abadcf169f4ee3b8/desktop.webp
- [Russian for Fish, Gallery](https://designly.sh/s/russian-for-fish/work/st-saviours-road?format=md) — Creative studios · Gallery · Custom code · London, UK · styles: type-led, editorial, minimal, airy · image: https://designly.sh/media/captures/cap_ff8738601d6d420c9172ccdf809f7f45/desktop.webp

Credit: every reference is a real business's site. If it shapes your work, link to the business and to its Designly page.