Marketing system
The token library and component set used to build Pierce Law marketing pages. Every value is a token: compose from semantic tokens, which resolve to primitive ramps. Change a primitive once and the whole site follows.
How this is organized
Marketing splits into two tracks. Web is the on-site system — tokens (typography, color, spacing) then a component library built from them. Email is its own discipline: principles for building inbox-grade HTML, plus a set of ready-to-send templates. Component names are intentionally generic so they can be reused across products — the Admin view is a muted theme on the same tokens.
| Section | What's in it |
|---|---|
| Typography tokens | Primitive type scale → semantic roles |
| Color tokens | Full ramps, light/dark semantics, AA contrast pairings |
| Spacing tokens | 8-pt primitive scale → semantic spacing & radius |
| Photography | Master prompt, image library, reverse prompts + usage |
| Illustration | Engraved motifs, tokenized colorways, when to use each |
| Components | Buttons, fields, cards, lists — with live previews + markup |
| Layout | Large-formatting rules: section limits, repetition, depth management, copy, visual rhythm |
| Email · Principles | How Pierce email is built — typography fallback, logo, dark mode, deliverability |
| Email · Templates | Ready-to-send HTML emails across a range of density & promotional style |