content.claymorphism-story-split · Story split

A content pattern from Claymorphism, drawn alone below with this design's tokens and sample copy. Used in this design on: about page, section 1. Give the section root data-pattern="content.claymorphism-story-split". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
A surfaceAlt clay card holding a 4:5 clay object in 1–5; in 7–12 a pill label, h2 at step 6, a lead, a body paragraph and a row of three stat pills.
Slots
image, sectionLabel, title, lead, body, stats[3..3]
Grid areas
object 1-5 · copy 7-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #F2EDFF · text #2B2340 · heading #1E1733 · accent #FF64AC · accent2 #00C09F · Fredoka / Nunito · radius 32px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • A surfaceAlt card in 1–5 holding a 4:5 clay object; in 7–12 a white pill label, h2 at step 6, a lead, a muted body paragraph and three white stat chips in a row (stacked on phones).

About

How we think

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.

We hand over everything — source files, a living brand system and a website your team can edit without calling us.

140+

launches shipped

12

years independent

9 of 10

clients return