01
02
A nearly full moon's dramatic chiaroscuro punctuates spring-fresh clarity and generous white-space as disparate design signals—Awwwards rooms, Tigers score, Dickens reflection, Hacker News momentum—find conversation through the Split.
Why
The brief from Doug's director is remarkably specific and architectural — it's not a mood to interpret but a visual specification to faithfully execute through tokens. The system I've built prioritizes two core tensions that define May 3rd: lunar drama and spring clarity.
The color palette anchors on a single cool spring mint (H:160°, S:65%, positioned at the edge of the mandate's open window) that carries interactive weight without aggression. A warm amber secondary accent (H:35°, complementary contrast) appears sparingly in emotional signals only—Tigers score, Dickens quote border, moon percentage. The neutral scale deliberately desaturates to 5-8% saturation, preserving the clean, directional quality of 13.7-hour May daylight: bright without glare, cool without coldness. The waning gibbous moon (94.5%) translates into tonal architecture: near-black Awwwards room cards erupt against pale panels, creating sharp chiaroscuro that fulfills the brief's demand for "dramatic contrast."
Spacing tokens respect the Split archetype's dual nature: generous gaps (32–64px) between signal blocks permit leisurely Sunday exploration, while micro-rhythms (4–8px) within components signal precision and craft. Typography tokens (lineHeights 1.0–1.82, letterSpacings -0.03em to +0.14em) manifest the "personality in spacing" the brief requires — Radiohead's angular geometry in tight display spacing, GBV's scrappy warmth in loose small-cap widths, MMJ's introspection in the Dickens quote's generous line-height.
Mood
A late-spring Sunday afternoon when the light is still generous (13.7 hours of daylight) but the day already feels like it's winding down. The energy is spacious and unhurried — weekend permission — but there's an undercurrent of intellectual curiosity threading through (strong HN and GitHub signals, design references all pointing toward build-it-yourself platforms and innovation). Hold the tension between relaxation and restlessness: a designer on Sunday scrolling through Awwwards and thinking about shipping code. The moon is nearly full (waning gibbous at 94.5% illumination), lending subtle dramatic contrast to everything it touches — don't flatten this; let it create visual drama even in the spaciousness.
Composition direction
Gallery Wall with Scroll undertones.
Today's signals pull in multiple directions at once — Awwwards references show distinct design languages (shaders, engineering, youth culture), GitHub suggests technical depth across languages, and the quote + music + sports create a personal collage. Gallery Wall lets you hold these disparate elements in conversation without forcing false hierarchy or narrative. It respects Sunday's permission to browse, not sprint. The Scroll undertone means each "wall" item should feel discoverable, not all-at-once — there's motion, but it's leisurely.
Typography direction
Generous spacing with theatrical contrast.
Type should breathe — this is weekend reading energy, not Monday morning density. But pair that generosity with high-contrast weight jumps (the near-full moon demands visual drama). Headings should have personality without shouting; they should feel like they're inviting exploration rather than commanding it. Use angular precision in accent typography (inspired by the Radiohead + technical GitHub signals) but keep body copy warm and approachable. Let negative space do as much work as letterforms.
Signal integration
Awwwards sites of the day → Feature three distinct visual "rooms" on the Gallery Wall — each pulling a different compositional or typographic gesture from the featured sites. Don't copy; learn. "THE NO-CODE SHADER" should hint at precision and craftsmanship (tight, modular spacing). "WFEO" should carry engineering weight (structured, authoritative). "The Push" should feel youth-forward and dimensional (layered, playful). Display these as interactive cards or linked reference zones, not a flat list.
Waning gibbous moon (94.5% illumination) → Increase tonal contrast throughout. Use deeper shadows, sharper highlights. This is the visual equivalent of late-afternoon sun hitting sharp angles. The near-full moon should feel present — perhaps a subtle lunar indicator in the corner, or use high-contrast shadow/light interplay in the layout itself.
Sunday / Weekend energy → Layout should have white space and breathing room. Sections should feel discretionary to explore, not mandatory to consume. Pace is slow; discovery is rewarded.
Spring season + 13.7 daylight hours → Palette should be bright and unsaturated — fresh greens, clear off-whites, perhaps a warm cream. Avoid heavy saturation; keep colors clean and minimal. The long daylight should feel like an availability of light, not a oppressive brightness.
Detroit Tigers win (5-1) → Acknowledge briefly and proudly, but don't centering it. A small inline scoreline badge near content, celebratory but not triumphant. Tone: "Nice Sunday evening." Not: "CHAMPION."
Guided by Voices, My Morning Jacket, Radiohead → These three bands suggest lo-fi warmth (GBV), Americana introspection (MMJ), and precise angular beauty (Radiohead). Let this manifest as personality in spacing and line-height, not imagery. Radiohead's angular DNA should influence how you kern certain words or set display text. GBV's scrappy energy should whisper through in small typographic choices (slightly imperfect baseline alignment in micro-copy, maybe).
Cadillac Championship leaderboard → Sunday golf is Sunday golf — not urgent, but present. Display the leaderboard as a quiet reference element, not a hero. Cameron Young's -15 lead is notable but not the story of the day. Integrate it as a sidebar or footer-level element with restrained typography.
Charles Dickens quote → This quote about parting and reunion carries emotional weight and has genuine resonance on a Sunday when people are often thinking about the week ahead. It deserves placement but not dominance. Consider it as a subtle typographic moment — set it in a different voice from the main type palette, perhaps with more generous line-height, in a secondary location on the page.
Hacker News momentum → "Six Years Perfecting Maps on WatchOS" (296 pts) and "Ladybird – April 2026" (333 pts) signal thoughtful, patient technical work. This should inform the tone of how you present your own work or case studies — meticulous, not flashy. If Doug has projects visible, frame them with language that suggests care and iteration, not overnight genius.
Palette direction
Spring-forward and luminous with minimal saturation. Favor bright off-whites, pale creams, and cool fresh greens — the palette of mid-May light before the heat saturates everything. Keep the saturation low to mid-range; this is not a candy palette. High contrast between light and dark (driven by the near-full moon signal) means your darks can be near-black and your lights can be nearly white, but avoid muddy mid-tones. Temperature should lean slightly warm (spring has turned; it's not early-April coolness) but not sun-baked. The feeling is: clarity, not warmth. Think of the specific quality of 6 PM light on a May Sunday in the Midwest — clear, directional, without harshness.
END BRIEF
03
cool spring mint
hsl(160 65% 50%)
Cool spring mint (H:160°, full saturation) as the single dominant accent carries interactive presence: links, nav focus, alert rings, the moon percentage. Warm amber (H:35°, 120° away) appears only in emotional signals—Tigers badge, Dickens border, lunar illumination label—earning attention through rarity and warmth contrast alone. Sage-grey neutrals (H:160°, S:5-8%) preserve crystalline clarity across the 13.7-hour May daylight without flattening. The waning gibbous moon (94.5%) drives tonal architecture: near-black Awwwards room cards burst against pale, nearly-white panels, creating sharp chiaroscuro and hard micro-shadows that echo the moon's drama. Spacing scale (4px base) honors Sunday's dual nature—generous panels (32-64px) permit leisurely browsing while tight rhythms (4-8px) signal craft precision. One hue anchors the system; one warm accent punctuates emotion; breathing room welcomes discovery; high tonal contrast creates visual presence without saturation.
04
Color — 3 ramps, 15 stops
stone
mint
amber
05
No composition grammar. The pipeline had no such concept in the color-directed era.
06