FirmClerk creative: concept, design system, and the tailored homepage directions, in one place.
A working gallery of prototypes and brand material. The Editorial direction is the confirmed system, built into the production site; Atelier and Studio are explorations kept for the record.
Marketing Site — Homepage directions
Confirmed · A→
Editorial
Light paper, Fraunces serif display, a single oxblood accent, ruled separators. The approved system: measured, exacting, AA-clean. This is what the production site is built on.
Exploration · B→
Atelier
A warm, drenched dark: the tailor's workroom at night. Bricolage Grotesque, oxblood as a glowing accent. Material and confident. Departure, not adopted.
Exploration · C→
Studio
Bright and structurally precise, with oxblood promoted to a committed color field; the lining becomes the cloth. Schibsted Grotesk, Swiss-ish grid. Departure, not adopted.
Design System
Locked→
Design system
The Editorial visual system: oklch tokens, the single oxblood accent, type scale (Fraunces / DM Sans / DM Mono), components, motion, and the WCAG 2.1 AA floor.
Tokens→
Design tokens
The Editorial token set as CSS custom properties (light + ink band), ready to drop into a build. Mirrors DESIGN.md.
Brief→
Brand brief
Company, domain, palette, typography, voice, and the rules that keep the tailoring metaphor honest.
Product & Concept
Canonical→
Product brief
What FirmClerk is: custom AI-agent automation built and run for businesses (H2A / A2A), the tailored-suit positioning, users, anti-references, and design principles.
Repo→
Production site → firmclerk.com
The live marketing site repo, built on the Editorial system: homepage + function-led branch pages (Finance, Sales, Support, Operations, Admin) + shared assets.
Archive