Prompt

“A law firm for startups: serious, editorial serif, fixed fees, calm.”

The agent invented Calder & Rowe - A three-partner London law firm for startups where every matter is quoted as a fixed fee in writing.

Toolchain: pure + inspo
Register: light mode
Build effort: 11+ MCP calls · 5 sites studied
Self-score: 7.5 / 10

The page it shipped - live, scaledOpen full page ↗

The move

The fee list is the page. Instead of tiers, it is a menu of eight matters set as hairline rows with the price on the right, taken from Inspo's per-use pricing reference, and each row carries a small round checkbox: tick the matters you need and a quiet card on the left totals them in the same light serif as the headline, with the VAT and filing-fee caveat underneath. It turns "fixed fees" from a claim into something you can add up before you have spoken to anyone, which is the whole premise of the firm, and it does so without a calculator widget, a slider or a colour change louder than the burgundy dot.

What Inspo gave it

The captures it studied, and exactly what each one contributed.

Contra Labs - Powered by Contra - Warm stone paper with deep burgundy-brown serif text and a light-weight Source Serif 4 display face; the page's paper, ink and accent tokens come from this palette, and the headline weight (300) follows its lead.
Magnumphotos - A centred italic serif pull quote at display scale, with the attribution tucked beneath in muted grey; became the statement section between the fee list and the partners.
Maggieappleton - Warm off-white ground, a muted plum accent that lands only on links, and every link terminating in an arrow rather than a button; the hero's secondary "See the fee list" link and the restraint on buttons come from here. Its DESIGN.md gave the serif-display, sans-meta split and a 132px top step for the section rhythm.
Harvard Edu - Asymmetric split of a large left-aligned headline against a smaller block of body text on the same grid, no containing box; used for every section head (meta label in columns 1 to 2, heading in columns 3 to 9).
Daniel Do - Italic serif for one emphasised phrase inside an otherwise upright headline; the italic accent word in the hero and closing headline follows this.

How it was built

The actual MCP calls, in order.

recommend
```
brief "A law firm for startups: serious, editorial serif, fixed fees, calm", mode light, vibe serious
```
Picked Marquee Hero, returned wallpaper-com, harvard-edu--about, factmag-com, rivian-com, hbo-com--about, the Marquee hero JSX (mono dateline in a 2-column margin, headline in the remaining 10) and the spacing guidance (96px median seam, padding-inline only on containers).
search_screens
```
query "law firm professional services editorial serif calm fixed fees", displayClass roman-serif, paperBand light, limit 8
```
eyemagazine-com, daniel-do, maggieappleton-com, fermliving-com--products-muses-clio, magnumphotos-com--about-magnum, handhold-io, contralabs-com, bbc-com; the serif-on-light-paper set the build leans on.
search_screens
```
query "quiet editorial serif landing page, long document, serious, calm", style editorial, vibe calm, mode light, limit 8
```
psyche-co, effectivealtruism-org, craigmod-com, lookback-com, flomoapp-com, daniel-do, newmuseum-org--about, bluebottlecoffee-com; confirmed the warm off-white paper band and that calm pages keep one accent off the headline.
find_components
```
type pricing, style editorial, mode light, limit 8
```
Crops from amie-so, area17-com, babbel-com, barbican-org-uk, beauxartsparis-fr; none were fixed-fee menus, which pushed the build towards the reference JSX instead.
find_reference_components
```
type pricing
```
Seven archetypes; the per-use "line items" component (label plus note on the left, price on the right, hairline rows, hover colour shift) is the skeleton of the fee list.
get_screen
```
slug contralabs-com
```
Full record and autopsy: #d2cbb3 stone, #652c21 burgundy-brown, Source Serif 4 light, dark pill plus outlined pill; palette and display weight.
get_screen
```
slug magnumphotos-com--about-magnum
```
Full record and autopsy: centred italic pull quote as hero, #424242 and #7f7f7f monochrome text, hairline nav rule; the statement section.
get_design_system
```
slug maggieappleton-com, live false
```
Type ramp (82px serif h1 at weight 400, sans meta), spacing scale up to 132px, cream tokens #f6f5f1 and #fcfbf7, crimson #5f023e.
find_reference_components
```
type footer
```
Seven archetypes; the Address card (find us, write, hours, plus a rule and a one-line colophon, no social row) is the footer here, with the regulator paragraph added.
find_reference_components
```
type nav
```
Seven archetypes; Inline minimal (wordmark left, links inline, a tighter utility cluster right) is the nav.
search_screens
```
query "team partners profiles about page serif institutional", pageType about, mode light, limit 5
```
harvard-edu--about, render-com--about, maggieappleton-com--about, ghost-org--about; the Harvard split and Maggie Appleton's name, role, italic subline stack shaped the partner cards.

Palette, traced

Every token, and the reference it came from.

--paper#f3efe7Page ground. Warmer than Maggie Appleton's #f6f5f1 and lighter than Contra Labs' #d2cbb3 stone, so the serif reads as ink on paper without the page going beige.
--paper-deep#eae4d8Alternating band behind the fee list, the partners, the not-covered section and the footer; one step down from paper so sections separate without a hard colour change.
--ink#1e1a16All headings and body. Near-black with a warm cast so it sits on the paper rather than on top of it.
--muted#6f665cMeta labels, ledes, descriptions and attributions; the Magnum #7f7f7f role, warmed to match the paper.
--rule#d6cec0Every hairline: nav, section seams, the practice grid, fee rows, footer. Low contrast on purpose so structure is felt, not seen.
--accent#6b2a21Burgundy-brown from Contra Labs. Lands only on the ampersand in the wordmark, one italic word per headline, the practice numbers, checked fee rows, arrows and the step numerals. Never on a whole heading.
--accent-ink#f7f1e8Text on the accent fill when the solid button hovers.

Built with the Inspo MCP - try it on your own brief.← All examples