Screenshot of Studio Herrstrom

Studio Herrstrom

www.studioherrstrom.com

Pure-black editorial portfolio for a culture-shaping design studio, anchored by an uppercase serif display headline, four-pole nav chrome with a diacritic-stroke logomark, and a 2x2 grid of category-tagged case study tiles separated by hairline white rules.

Creative Studio Brand Design Studio niche

Design tokens

white
gray
black
blackTransparent92
display
SH-MIX (Season Mix Medium, Times-class serif, custom-named)
body
SH-SANS (Season Sans Medium, geometric sans, custom-named)
mono
(none - no monospace font in use)

Do / Don't

Reference it for

  • Pure rgb(0, 0, 0) black canvas with no near-black softening, full editorial commitment
  • Mid-grey rgb(90, 90, 90) for category eyebrows and metadata, the only intermediate value in the palette
  • Monochrome-only palette, three values total (white / grey / black), no chromatic accent
  • --color-black-transparent: #000000ec for overlay surfaces (black at 92% alpha)
  • Two-typeface bespoke system: SH-MIX serif (display) + SH-SANS geometric sans (body)
  • 63.9px uppercase serif H1 with tight 57.5px line-height and -1% tracking
  • Weight 550 as body default, unusual variable-axis bespoke weight
  • Four-pole nav layout (Process | Work | LOGOMARK | About | Contact), symmetric four-corner anchoring

Do not copy

  • The STUDIO HERRSTRÖM wordmark itself, or the H / Ö overscore-stroke ligature
  • The SH-MIX / SH-SANS / SeasonSans / SeasonMix font names and the Season-family typefaces (likely Herrström-licensed)
  • The "A design studio for brands who move culture" H1 phrasing
  • The "The Echo" trademark for the three-step process model
  • The Spotify / Ray-Ban Meta / Back Market / Discord / Filmhub client logo set
  • The exact mid-grey rgb(90, 90, 90) if the brand has any chromatic palette, it reads as deliberate Herrström restraint, not neutral
  • The "Erik Herrström" / "Kara Griffin Cushman" press copy
  • The double-arrow ↗ ↗ outbound-link pattern as a brand-voice signature

Signature moves

monochrome editorial canvas

a pure rgb(0,0,0) black canvas runs a three-value monochrome palette (white / grey rgb(90,90,90) / black) with no chromatic accent, mid-grey reserved for category eyebrows and metadata

four-pole nav with 2x2 hairline grid

a four-pole nav layout (Process | Work | LOGOMARK | About | Contact) anchors symmetric four-corner chrome, and a 2x2 case-study grid uses hairline white rules forming visible quadrants with category eyebrows and an inline ↗ link glyph

single-workhorse transition with clamp spacing

an all 0.25s ease-in-out workhorse transition (64 hits) carries most motion, with directional fade-in/out keyframes and staggered index-row reveals, on clamp-fluid spacing via calc() vars interpolating 400 to 1920px