Prototype gallery
ElmsPark
A design comparison matrix for elmspark.com. Three palettes crossed with two typography pairings. Every variant ships the same four pages, the same copy, the same layout. Only palette and typography change.
Original design
The homepage, about, and contact pages as generated by BuildTheWeb.site. Included as the baseline against which the six variants below are measured. Three pages, same architecture (home, about, contact); no 404.
Open the original →| Fraunces + Inter | EB Garamond + DM Sans | |
|---|---|---|
| Deep Forest moss | Open variant → |
Open variant →
Canonical pairing |
| Warm Kinfolk warm earth brown |
Open variant →
Canonical pairing |
Open variant → |
| Ink and Pearl tobacco, pearl | Open variant → | Open variant → |
All six use the exact $bg1 / $bg2 / $c1 / $c2 / $ca / $border1 hex values from the PageMotor Lab, plus the same two derived tokens (--ink-soft, --accent-hover) that the palette spec doesn't provide. Each palette's canonical pairing is on the diagonal: Warm Kinfolk + Fraunces, Deep Forest + EB Garamond. The other four are deliberate cross-pairings.
Two variants deliberately outside the Ink-on-Paper plus Fraunces / EB Garamond territory of the matrix above. Different palettes, different typography, different tonal register. Both still honour the same copy, structure, and brand rules.
Dark mode, all-monospace
Why it surprises: every other variant reads as quiet craft. This one reads as developer terminal.
Why it could work: your thesis dramatises "I design. My AI builds." Brutalist Neon leans into the AI half rather than hiding behind warm earth tones. It reframes the practice as technical and systems-led. No coach, agency, or freelance designer in the Wexford market looks like this.
Open the surprise →Editorial newspaper, condensed display
Why it surprises: abandons every earth tone for near-white paper with a deep red signal accent. Condensed sans headlines, refined serif body.
Why it could work: positions ElmsPark closer to a cultural institution or literary journal than a freelance designer. The condensed display gives the homepage thesis typographic drama the serif variants can't reach. The red reads like a wax seal, not a signboard.
Open the surprise →Every variant applies the same 15 memory levers (distinctiveness, emotion, repetition, self-generated content, surprise, and the rest). Palette and typography change; the design discipline does not.
Three palettes from the Ink-on-Paper category at pagemotor.com/lab/design-generation/hex-codes.html. Each uses the exact six canonical tokens, plus two derived states (ink-soft and accent-hover) that the palette spec does not supply.
Two pairings from pagemotor.com/lab/design-generation/font-pairings.html. Fraunces + Inter is the canonical pair for Warm Kinfolk. EB Garamond + DM Sans is the canonical pair for Deep Forest. The other four cells are deliberate cross-pairings.
GDPR-compliant, privacy-first, zero third-party cookies. Identical coverage to Google Fonts, without the EU data-transfer risk.
British English, no em dashes, first-person singular throughout. Confident, opinionated, dry. Pricing stated as numbers or equivalent monthly pricing; the word "free" does not appear anywhere on the site.
Always rendered as <span>Elms<span class="accent">Park</span></span> inside a wrapping span, so flex gap cannot insert whitespace between the two halves.
WCAG 2.2 AA minimum. Semantic HTML, keyboard navigation, visible focus states, skip links, prefers-reduced-motion respected.
Ready to port to PageMotor 0.8.2b. The static build is the honest comparison surface; PageMotor-native implementation follows the chosen variant.