Images & captions
Neue Montreal — visual reference for the h1–h6 scale, components, and the grid system. Pulls live from fonts.css and global.css. This page's own layout uses .container + .grid.
One-word headings — size & weight at a glance
Paragraph
Multi-line examples — how each level reads as real copy
This is a full paragraph of body copy set at the base size, so you can judge line length, line-height, and general readability at a normal reading width. It should feel comfortable across two or three sentences without the lines running too long or too short.
A second paragraph to check the spacing rule between stacked paragraphs — this uses the p + p margin defined in global.css, not a manual gap.
.brand and .highlight — usable on any element
Thanks for stopping by — this paragraph has a highlighted phrase sitting right in the middle of a normal sentence, so you can see how the background box sits against body copy.
Testing a longer highlighted run so it wraps across two lines: this whole phrase is highlighted and long enough that it should break onto a second line inside the paragraph — watch how the box behaves at the wrap.
Pills — standalone labels/badges, not for inline sentence text
Brand Campaign Digital 2019
Body text
Buttons — hover to see background shift and arrow nudge
Links — brand pink default, hover pink on hover/focus
This paragraph contains a standard link sitting inline in a sentence — hover or tab to it to see the color shift from brand pink to hover pink, with the underline growing in.
.grid — 12 columns, common patterns. Resize your browser to see mobile/tablet/desktop stacking.
.breakout — ignores the container, runs true full-bleed edge to edge
Images & captions
Blockquote / pull-quote
"Working with Nick completely changed how our brand shows up — sharper, more confident, and finally consistent." — VP Marketing, Client Name
Lists — .list (unordered), .list--ordered
.eyebrow + .eyebrow-title — black default, .brand for pink
Secondary text, de-emphasized — dates, meta info, captions.
Callout boxes — for important / called-out text
Every decision starts with what the brand stands for, not what's easiest to ship. Read more about the approach behind it.
BBDO, TBWA, Ogilvy, and Publicis — see the full career history and what each one contributed.
Revolver Studios started as an idea and became a working marketplace — see the case study.
Form elements — inputs, textarea, focus & error states
.entry-list — shared row pattern for every dated/labeled list on the site (Experience, Awards, Education, Certifications, Leadership Capabilities, Hard Skills, AI Skills, Recent Stuff, Archives)
Revolver Studios 2024 — Present
Founder, Creative Director
Publicis 2017 — 2021
Head of Brand
Ogilvy 2013 — 2017
Associate Creative Director
.entry-list__item--case-study — modifier for a row with a circular image, heading, description, and arrow-circle link (used on the Work page's Case Studies section)
Color reference
