Screenshot of Laugh Mind

Laugh Mind

laugh-mind.co.jp

The reference for Japanese motion-heavy creative studios — a near-black SvelteKit canvas, a serif-led type system anchored on ambroise-francois-std, a Pixi.js WebGL layer, and a slow Lenis-driven loader that turns the entry into a performance.

Creative Studio Brand Creative Studio niche

Design tokens

page
surfaceMid
textBody
textHeadline
textInverse
textPure
accentPink
highlightNeonYellow
highlightElectricViolet
display
ambroise-francois-std
body
ambroise-francois-std
mono
japaneseDisplay
hiragino-mincho-pron
supporting
elido
systemFallback
-apple-system, blinkMacSystemFont, Helvetica, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "BIZ UDPGothic", Meiryo, sans-serif

Do / Don't

Reference it for

  • Near-black rgb(16, 16, 16) page + rgb(56, 56, 56) rare secondary surface — darker than Koto's rgb(20, 20, 20)
  • rgb(195, 195, 195) light-grey body text (615 hits — overwhelming majority) — lighter than Koto's rgb(152, 152, 152)
  • Single pink accent rgb(237, 27, 91) — used sparingly (18 hits) for character-tint and highlight
  • Two saturated highlight colours: rgb(222, 255, 0) neon yellow + rgb(96, 1, 255) electric violet, each ~7 hits
  • Serif-led type system with ambroise-francois-std doing display *and* body — unusual for a portfolio
  • Japanese mincho secondary (hiragino-mincho-pron) — bilingual typography discipline
  • 2-weight system (300, 400) — extreme restraint for a 12-step type scale
  • 12-step type scale reaching ~100px for page-index numerals

Do not copy

  • The LaughMind wordmark with the mid-character pink "M" tint
  • The "Brieative" portmanteau positioning (brand + creative)
  • The ambroise-francois-std Typekit licence (Typekit subscription required — substitute with Cormorant Garamond or Libre Caslon Display)
  • The elido and hiragino-mincho-pron Typekit faces
  • The Typekit ist7cmm kit identifier
  • The Pixi.js hero unless the brand has a real interactive WebGL story
  • The L00 numbered-page-index unless the site is genuinely paginated as a portfolio
  • The Mieruca-HM Japanese heatmap dependency

Signature moves

choreographed serif loader as performance

a slow Lenis-driven preloader turns entry into a performance with a circular 00 ring and a custom half-scroll keyframe, on a near-black rgb(16,16,16) canvas with serif-led ambroise-francois-std type

page-index numerals as oversize serif art

page-index numerals (L00) are set top-right at ~100px serif as a compositional art element, within a 12-step scale reaching ~99.4px and an extreme 2-weight (300/400) restraint

mid-character accent-tint wordmark

the wordmark carries a single mid-character pink tint (Laugh M[pink]i[/pink]nd) as micro-detail typography, with the pink rgb(237,27,91) accent used sparingly elsewhere