Canvas

Brand brief — Sumi × TOI CVCDESIGN.md▸

DESIGN.md — Taiho Ventures (38 · Sumi × TOI palette)

Per-style brand authority for src/styles/38-sumi-toi-cvc/. Produced and maintained by columbus-design-md-builder. Read by columbus-design-author at scaffold time and by columbus-design-iterator on every refinement. Treat sections 1–7 as canonical truth.

Lineage. Direct successor to 35-sumi-brushwork-cvc (the canonical sumi-brushwork build Taiho picked on 2026-05-27). The sumi mechanic, the Gladwell-ration'd voice, and the Mincho × Spectral pairing carry forward unchanged. The shift is §3 Color and the §6 atmosphere notes that depend on it: the page is recolored to the TOI palette per Adrienne Duncan's 2026-05-27 spec — Ocean as the dominant darker color, Sky and Pebble as alternating brush-stroke surfaces, Focus for hover/accents, Clay eliminated. Successor to the failed 37-sumi-ocean-toi-cvc (deleted 2026-05-28). That attempt under-committed Ocean — parked as a thin ribbon, brushwork plates kept in heritage Sepia/Vermillion — so the page still read as the 35 build with a band on top. This DESIGN.md reverses the under-commit: Ocean is also the ink of the brushwork, not just a surface block.

Scope this round. Landing page only. The 35-style 5-page IA collapses into one scroll (Hero → About / Mandate → Investment → Portfolio → Team → Anniversary moment → Outreach). The brand identity below describes the whole brand; only landing.tsx is being scaffolded.

1. Aesthetic Anchor

Primary family: Warm Editorial — paper-and-serif, classical-publication restraint, the long-read register. Secondary remix: Sumi-e brushwork × Japanese editorial heritage — washi-tinted paper, ink-painted marks, ma as structural device. The remix is non-negotiable; brushwork is the active visual mechanic, not flavoring. Reference brands: 5AM Ventures (clinical-editorial type discipline, baseline biotech-VC literacy) × Issey Miyake (editorial Japanese restraint, asymmetric composition) × Toraya (warm-paper + sumi brushwork applied commercially, the 500-year confectionery house's modernized identity system). Visual atmosphere: The page reads like a quarterly journal printed on warm-cream washi, but the ink is teal. Sumi-e brushwork carries the structural gestures — section breaks, hero compositions, marginalia accents — painted in Ocean rather than the heritage sumi-black. Sky and Pebble alternate as section beds the way watercolor washes alternate on a hand-bound book. The single Focus (vermillion) hanko seal marks signature moments. Where 35 reads as a sumi-ink quarterly, this reads as the same quarterly's TOI-aligned edition — same hand, different inkstone.

2. Brand Voice

Carried forward verbatim from 35-sumi-brushwork-cvc per user direction. Voice work is not being redone for this round.

Adjectives: observational, counterintuitive, scene-led, considered, accessible.

Voice anchor: Malcolm Gladwell — the editorial voice (full fingerprint in anti-slop-copy/references/voices.md). Anecdote-then-thesis where the page has room (About, Case Studies, Mandate explainer, Insights, the 10th-anniversary moment). Tight observational sentences where it doesn't (hero, CTAs, nav labels, captions). The signature is the move, not the form-factor of every block.

Voice sample (real Gladwell anchor, David and Goliath):

"Giants are not what we think they are. The same qualities that appear to give them strength are often the sources of great weakness."

Says:

"What Taiho adds is the cap-table credibility of a global pharmaceutical company."
"The harder thing in early-stage oncology is not capital. It is the partner who can take an asset across the Pacific."
"Most rounds close on a term sheet. A few close on a thesis about who the founder wants on the cap table ten years from now."

Avoids:

"premier" / "premier pharma-backed" — the brief's framing, not the brand's voice. Reads as self-coronation. Replace with substance ($400M, ten years, named syndicate partners, named portfolio companies).
"ecosystem" / "biotech ecosystem" — generic VC vocabulary. This brand earns the right to be specific (oncology, immunology, urology, Series A/B, syndicate, cap table).
"innovative therapeutic landscape" / "cutting-edge science" — SaaS-register jargon that fights the literary visual.

Sample sentences (drafted in voice, run through the critique pass):

About lede. In 2016, a four-person team in Menlo Park began deploying capital from Taiho Pharmaceutical's first venture fund. The syndicates they joined were already crowded — seed and Series A rounds for early-stage oncology assets routinely included ARCH, GV, MPM. What Taiho added was something the founders had not been asking for, and the lead VCs had not been able to offer: the credibility of a $400M Japanese specialty pharmaceutical company on the cap table. Ten years later, that has turned out to be harder to find than money.

Hero. Early-stage oncology investing is a syndicated business. The lead VC writes the term sheet; the syndicate adds the rest. What Taiho Ventures adds is the cap-table credibility of a $400M Japanese specialty pharmaceutical company — and a path from preclinical asset to global commercialization.

3. Color Palette & Roles

Mode: light (warm-paper, single mode — no dark variant).

Governing principle. Text color and brand-dominant color are different axes. Body and headlines stay near-black (Earth). "Dominant darker color" — Adrienne's phrase for Ocean — names the color that rules the page's visual identity, not the color that paints the words. Ocean rules through three deliberate deployments:

The brushwork is painted in Ocean. This is the structural change that makes the page READ as a TOI variation. The sumi-e gestures — hero composition, section breaks, marginalia brushstrokes — are painted in Ocean ink, not heritage sumi-black. Where 35's calligrapher dipped in sumi, this one dips in Ocean.
The footer is a committed Ocean band (full-bleed, Paper text), so Ocean is structurally felt at the close of every page.
Ocean-deep is the active state — primary CTA hover, mokuji-link hover-tail in some compositions.

These three deployments together earn Ocean the "dominant" descriptor without violating the text-color rule. The previous attempt (37) parked Ocean only on a ribbon strip; this attempt makes Ocean the calligraphic gesture itself.

Type anchors (always near-black, never branded):

#3D2316 (TOI Earth, --sumi-toi-ink) — Mincho display headlines, body text, mokuji link rest state. Deep warm brown; the only "near-black" type color on the page.
#5A3A28 (Earth-soft, --sumi-toi-ink-soft) — secondary body, hover/active states for mokuji.
#7E5841 (Earth-muted, --sumi-toi-sepia) — second voice: eyebrows, marginalia, small-caps chrome. Distinct from primary ink so the typographic hierarchy stays legible. (Reuses the heritage "sepia" role from 35 in a slightly lighter brown — the Taiho logomark's brown survives only inside the SVG itself.)
#A07659 (Earth-mute, --sumi-toi-sepia-soft) — lowest-emphasis chrome.

Surface palette (where brand color lives as paper):

#FAF8F5 (TOI Paper, --sumi-toi-paper) — page background. Slightly warm off-white, never pure #FFFFFF. The "washi" register.
#D8F1ED (TOI Sky, --sumi-toi-sky) — section bed A. Mint-tinted wash, used as alternating section background; brushstrokes on Sky read as paint-on-paper.
#E8DDD3 (TOI Pebble, --sumi-toi-pebble) — section bed B. Warm beige, used as alternating section background; brushstrokes on Pebble read as paint-on-paper. Sky and Pebble beat against each other to give the scroll its rhythm.
#F1EAE2 (Pebble-2, --sumi-toi-pebble-soft) — card surfaces, marginalia gutters when Pebble would be too loud.
#C9BFA5 (warm rule, --sumi-toi-rule) — hairlines, faint borders for utilitarian dividers (table rows, footer minutiae).

The dominant darker color (lives as ink + committed surface):

#0F7280 (TOI Ocean, --sumi-toi-ocean) — the brushwork ink. Hero brushstroke, section-break sumi-e gestures, marginalia brushstroke accents. Also the committed footer band surface (Paper text on Ocean). Also the hover-state fill for primary CTAs.
#0A5A66 (Ocean-deep, --sumi-toi-ocean-deep) — Ocean's hover-state companion. Used on CTA hover, on link-hover underlines where Ocean is the rest state, and on the densest brushstrokes when a single composition stacks multiple Ocean values.

Accent (vermillion paint, never type for long-form):

#D63027 (TOI Focus, --sumi-toi-focus) — kakko bars on pull-quotes, hanko seal stamp (the 十 mark on the anniversary chip and the AnniversaryPanel), mokuji link underline on hover when paired against Paper or Pebble surfaces, occasional vermillion brushwork accent on Ocean compositions for contrast. Treated as paint, never as a flat UI fill. Survives in the brushwork plates as the single warm counterpoint to Ocean — the calligrapher's red signature stamp.

Eliminated:

Clay #A36234 — explicitly dropped per Adrienne 2026-05-27. No brown ribbons, no brown header bands, no warm-brown anywhere in a dominant role. (Earth is body type — that role stays.) --sumi-toi-clay is not defined. If a composition wants the warm-brown register, that warmth lands on Pebble (a surface) or Sepia (a type ink), not on Clay.
Energy yellow #F0BC2A — not in Adrienne's spec for this style. Removed from the token map. Any 35 component that used the heritage Taiho Yellow (--sumi-ochre) is regenerated in Sky or Pebble for the wash, or in Focus for the accent. The 10th-anniversary "yellow sun-disc" gesture from 35 becomes a Focus hanko-seal gesture here.

Notes. No CSS gradients. The only gradients on the page live inside painted artifacts — a brushstroke fades because the brush ran out of ink, not because of a CSS interpolation. Color is applied as PAINT wherever possible. When a flat fill is unavoidable (form fields, table cells), keep it neutral (Paper, Pebble-soft) and let the surrounding brushwork carry the brand signal. The two deliberate flat-fill exceptions are (a) the Ocean footer band and (b) the primary CTA pill — both committed brand surfaces, sized and placed so the brushwork still rules visually.

4. Typography Rules

Carried forward unchanged from 35-sumi-brushwork-cvc. The Mincho × Spectral pairing was not in dispute in Adrienne's feedback.

Headline font: Shippori Mincho B1 — https://fonts.google.com/specimen/Shippori+Mincho+B1 — weights 400, 700. A modern Mincho (明朝) typeface; supports Latin and reads as Japanese editorial restraint without exoticism. Body font: Spectral — https://fonts.google.com/specimen/Spectral — weights 300, 400, 500. Designed for long-form reading; pairs as Western editorial serif against the Mincho display. Pairing principle: Same considered-serif register, two cultural lineages. The pairing IS the brand's bicultural DNA — Japanese pharmaceutical heritage meets Menlo Park venture fluency. Both serifs, no sans. Weight extremes: 300 (light body for long-form) vs 700 (display headlines only). No 500 SaaS-bold. No 600. Size scale:

H1 (display): 4.5rem
H2 (section): 2.5rem
H3 (subhead): 1.5rem
Body: 1.0625rem (17px — slightly larger than typical for editorial readability)
Caption / marginalia: 0.875rem
Pull quote: 1.875rem (italic Spectral)

Max font sizes per page: 3.

Banned (do not use): Inter, Roboto, Open Sans, Lato, Helvetica, Arial, system stacks, Space Grotesk, Poppins, Montserrat, Playfair Display, Times New Roman, Georgia, Merriweather, EB Garamond, Cormorant Garamond. The first cluster reads SaaS; the second cluster reads "every editorial blog template."

5. Layout & Density

Grid: 12-column editorial with intentional asymmetry. Long-form prose lives in cols 2–9 (left-anchored, eight columns wide). Marginalia — citations, dates, sub-thesis, hanko seals — hang in cols 10–12 (right gutter). Brushwork artifacts may overshoot the column grid intentionally, the way a calligrapher's stroke leaves the page. Container max-width: 1280px (the column shell). Body prose has an inner reading width of ~680px to keep line lengths editorially tight (~70 characters). Section rhythm: varied — dense long-form sections (About / Mandate explainer, Investment criteria) breathe against painted ma sections (single brushstroke, single line of type, vast Paper or Sky). The Sky / Pebble alternation drives the secondary visual rhythm beneath the prose rhythm. The page should feel composed, not gridded. Min container padding: 24px (mobile), 80px (desktop).

Asymmetry / overlap commitments:

Hero composition is off-axis — type left-anchored, painted Ocean brushwork floating to the upper-right (or vice versa). Never centered, never balanced.
Section heads can hang in the left margin (as drop-style Mincho display caps or as a hanging Ocean brushstroke).
Sumi-e brushstroke section breaks may extend ~40px past the column edge into the gutter.
Pull quotes hang into the right gutter with a Focus (vermillion) vertical kakko bar.
The Taiho ellipse logomark may appear at hero scale as a watermark/wash element, but never centered — always off-axis, always large enough to read as art object.

Anniversary chip placement (new commitment, per Adrienne 2026-05-27):

The 10th-anniversary mention lives in two places: a small chip directly under the nav bar, hung from the right edge of the container, AND a full AnniversaryPanel mid-page between Team and Outreach (carried over from 35).
The chip is ~280–340px wide, ~80–100px tall — discrete, not a band. Pebble surface, Earth headline ("10 years · Taiho Ventures"), a single line of Sepia marginalia ("2016 → 2026"), and a Focus vermillion hanko 十 mark as the accent graphic floated at the top-right of the chip.
The chip is implemented as its own component (AnniversaryChip.tsx) and mounted in the landing layout with a single prop (<AnniversaryChip />). When Taiho leadership decides to remove the anniversary moment, the chip is one delete to drop — no surrounding code needs to know it existed.
The full AnniversaryPanel mid-page is the bigger statement. The chip is the "we still want this present even after a few seconds of scroll" reminder.

6. Atmosphere & Media

Hero treatment: Solid washi paper (--sumi-toi-paper #FAF8F5) with a single hand-painted brushwork composition floating off-axis. The brushwork composition is the atmosphere. The composition pairs Ocean ink (the dominant brushstroke), a Focus vermillion accent mark (small, hanko-scaled — the single warm note), and a Sky-tinted wash disc (where 35 used Yellow). The composition reads as sumi-e in Ocean ink, not as a logo treatment.

Atmospheric layers:

Subtle paper-grain noise (4–6% opacity) across the full page so Paper reads as washi, not pixel. The noise is warm-tinted (matches the Earth/Sepia register) — not a neutral gray noise.
Sky and Pebble alternate as full-width section beds behind the major scroll sections. The transition between Sky and Pebble is mediated by a brushstroke that bleeds across the seam — Ocean ink on the upper section, fading into the lower. No 1px rule between Sky and Pebble; the brushstroke IS the rule.
Ink-bleed image masks — image edges are torn / brushed, never crisp rectangles. The bleed is Ocean-tinted at the perimeter (matches the brushwork ink).
Sumi-e brushstroke section breaks replace 1px hairlines on key transitions. Hairlines (--sumi-toi-rule) survive only for utilitarian dividers (table rows, footer minutiae).
Hanko-style Focus (vermillion) seal marks at signature moments — the small anniversary chip's 十 mark, the AnniversaryPanel's bigger 十, founder pull-quote stamps, signed positions ("— Tim Wakeling, Managing Partner").
The committed Ocean footer band: full-bleed, Paper text inverse, sized as the bottom ~280–360px of the scroll. The Ocean register is felt at every screen's close.

Shadow style: None. No box-shadow, no elevation, no digital depth. Depth comes from pigment layering (Ocean over Sky over Paper) and paper texture. Shadows would fight the printed/painted register.

Media stance: mixed-media.

Stance reasoning: Type-only would strip the brushwork mechanic that defines the brand. The mix:

Editorial photography — team and portfolio company photography, treated with a duotone (Ocean + Earth) and ink-bleed edges. Real founders and team, never stock. The duotone shift from 35's (sepia + ink) to (Ocean + Earth) is the single biggest visual signal that this is the TOI-palette reading.
Decorative abstracts — real sumi-e brushstrokes painted in Ocean (with occasional Focus vermillion accents), Sky and Pebble washes, hanko seals. Hand-rendered (or hand-rendered-feeling) artifacts, never algorithmic shapes.
Logo grids — portfolio company marks ranged-left in a sparse editorial grid on Pebble, with co-investor names in Sepia caption type. No logo wall.
No product-UI (this is a fund, not a SaaS). No 3D illustration. No iconography sets.

Brushwork plate regeneration (reversal of 37's decision): the brushwork plates inherited from 35 are NOT carried over verbatim. They are regenerated in Ocean ink with Focus vermillion accents and Sky/Pebble washes. This is the structural call that makes Ocean "dominant" — the calligraphic mark IS Ocean. Keeping the 35 plates in heritage sepia/vermillion (the 37 decision) is what caused the previous failure; that interpretation gave Ocean no structural role.

7. Do's and Don'ts

Do:

Paint sumi-e brushstrokes in Ocean as the section-break primitive — not 1px rules, not gradients, not heritage sumi-black, not heritage sepia.
Treat Ocean as paint, surface, AND active state — three deployments together earn "dominant," not any one alone. Brushwork ink, committed footer band, primary CTA hover.
Beat Sky and Pebble against each other as alternating section beds. The transition between them is mediated by an Ocean brushstroke, not by a 1px rule.
Use Focus (vermillion) as the hanko seal, kakko bars, and the single warm accent inside Ocean brushwork compositions. Sparing — paint, never flat UI fill.
Pair Shippori Mincho display × Spectral body. Both serifs, two cultural lineages. The pairing is the brand's bicultural DNA, made legible.
Compose every hero and key section with deliberate asymmetry. Let ma (negative space) do structural work. Centered is forbidden as a default.
Treat image edges as Ocean-tinted ink-bleed or torn paper, never crisp rectangles.
Render team/portfolio photography in an Ocean + Earth duotone (the TOI-palette successor to 35's Sepia + Ink duotone).
Implement the anniversary chip as its own component, removable in one delete. Hang it from the right edge under the nav, ~280–340px wide, Pebble surface, Focus 十 mark.
Use named substance over abstract claims: "$400M, ten years, twenty-three positions" beats "premier pharma-backed CVC."

Don't:

Park Ocean as a small ribbon-only band and call it "the dominant darker color." That's the 37 failure mode. Ocean must paint the brushwork itself and own at least one committed surface.
Use Clay (#A36234) anywhere. The token is not defined. Heritage Taiho brown survives only inside the logomark SVG. Brown surfaces use Pebble; brown ink uses Earth/Sepia.
Use Energy yellow (#F0BC2A). Not in this round's spec. Any heritage-yellow gesture from 35 (sun-disc, anniversary yellow wash) is regenerated in Sky or Focus.
Color body or display headlines with Ocean. Type stays Earth. Ocean is paint and surface, not type. (The Ocean footer band's inverse type — Paper on Ocean — is a normal typesetting move on a brand surface and is not a violation.)
Default to cream-and-serif ornamental Warm Editorial without the brushwork. If a section could render in 02-sepia-paper-editorial's style, the brushwork mandate has been silently dropped — reject.
Use the brushwork plates from 35 verbatim. They are heritage sumi-ink; this style is Ocean-ink. Plates must be regenerated.
Use Inter, Roboto, Open Sans, Lato, Helvetica, system stacks, Space Grotesk, Poppins, Playfair Display, Times New Roman, Georgia, Merriweather, EB Garamond, or Cormorant Garamond.
Use the three-up icon-card feature grid. The mandate clarifies through prose and brushwork composition, not feature cards.
Use box drop shadows, soft elevations, or any digital depth treatment. Pigment layering and paper texture carry depth.
Use CSS gradients. Pigment fades because a brush ran out, not because of an interpolation.
Use exotic Japanese ornamentation — cherry blossoms, koi fish, samurai motifs, kanji as decoration. The Japanese DNA shows up in restraint, ma, brushwork, and the Mincho typeface — not in costume.
Use hamburger nav on mobile. Use a vertical Mincho "目次" (mokuji / index) text-link instead, paired with a Focus brushstroke marker.
Write CTAs as "Get started" / "Learn more" / "Sign up". Use first-person voiced CTAs ("Read the case studies", "Begin an outreach", "See the syndicate", "Read the mandate").
Use the brief's "premier pharma-backed CVC partner" framing in body copy. It's positioning shorthand, not a sentence the brand says aloud.
Make the anniversary chip a full-width Ocean band. Adrienne's spec was small block, right-aligned, removable. The band is the 37 failure mode in miniature.

8. Agent Prompt Guide

For any agent reading this file:

Read this DESIGN.md in full before writing any code, copy, or styling for 38-sumi-toi-cvc.
Treat sections 1–7 as canonical truth. Don't override them inline.
Reject any change that violates the Don'ts in section 7. Surface the conflict to the user rather than silently picking one side. The most likely silent failure for this style is under-committing Ocean — letting the page read as the 35 sumi build with TOI colors sprinkled on top. If the brushwork plates are still in heritage sumi-ink, if the footer is still on Paper, or if Ocean only lives on a chip/ribbon, the §7 "Do — paint brushstrokes in Ocean / own at least one committed surface" rule has been silently broken. Reject.
The voice (section 2) is Gladwell-ration'd-for-website, inherited from 35. Apply the anecdote-then-thesis move where the page has room (About, Mandate, Insights, anniversary). Tight observational prose elsewhere. Don't write magazine essays into hero / CTA / labels.
The anniversary moment lives in two places: the small AnniversaryChip under the nav (right-aligned, Pebble surface, Focus 十) AND the full AnniversaryPanel mid-page (carried from 35). Both must be present. The chip's "removable in one delete" requirement is non-negotiable.
Scope: landing-only this round. Do not scaffold about.tsx, portfolio.tsx, team.tsx, investment.tsx, or contact.tsx. The IA collapses into one scroll. meta.ts exposes only landing as a screen.
Content seeding: copy from src/styles/35-sumi-brushwork-cvc/content/*.ts is the starting point. The buckets and bucket shapes are correct; only the CTA / hero copy may need a light pass to reflect TOI-aligned visuals (e.g., the hero's "sumi-ink" reference if any).
If the user is asking for something this DESIGN.md doesn't cover, propose an addition to this file rather than introducing the decision in component code.
If the user is asking to change something in this file, route the request to columbus-design-md-builder rather than editing inline.
When sections conflict: section 7 (Don'ts) wins over everything; section 1 (Anchor) wins over sections 3–6; section 2 (Voice) is independent.

9. Notes & References

Created: 2026-05-28 Last updated: 2026-05-28 Source URL: https://www.taihoventures.com/ (legacy site — referenced for content scope, not aesthetic)

External references:

Email thread driving this round: /workspace/Taiho-Ventures-Concept-Designs-email-thread.md (May 8 → May 27 2026)
Canonical sumi lineage: src/styles/35-sumi-brushwork-cvc/DESIGN.md
Failed predecessor (deleted 2026-05-28, recoverable via git): src/styles/37-sumi-ocean-toi-cvc/
TOI palette token donor: src/styles/36-clay-corporate-taiho-toi/theme.css
TOI brand book (May 2026): /workspace/research/toi-may-2026/Taiho-TOI-branding-may-2026-compressed.pdf
TOI website mock (May 2026): /workspace/research/toi-may-2026/Taiho-TOI-website-mock-may-2026-compressed.pdf
Heritage Taiho brand mark + colors: /workspace/research/Taiho-ventures-basic-branding-v0.pdf
Site brief v4: /workspace/research/TOI2601_TVL Site Brief_v4.docx
Legacy copy archive: /workspace/research/legacy-web-copy/
Logomark SVG: /workspace/public/brand/taiho-logomark.svg
Shippori Mincho B1 specimen: https://fonts.google.com/specimen/Shippori+Mincho+B1
Spectral specimen: https://fonts.google.com/specimen/Spectral
Voice fingerprint (Gladwell): .claude/skills/anti-slop-copy/references/voices.md §1

Scope note: This DESIGN.md describes the complete brand identity. Only landing.tsx is being scaffolded in this round per user direction. The remaining 5-page IA (about / investment / portfolio / team / contact) is intentionally collapsed into the landing scroll. If a future round expands beyond landing, this section's scope note is the place to capture that decision.

Additions log:

2026-05-28: Initial DESIGN.md captured by columbus-design-md-builder. Successor to deleted 37-sumi-ocean-toi-cvc. Sumi brand DNA + voice + typography inherited verbatim from 35-sumi-brushwork-cvc. §3 Color and §6 Atmosphere rewritten to commit Ocean as ink + committed surface + active state (the 37 failure was parking Ocean only on a ribbon). Anniversary moment doubled: small removable chip under nav + mid-page AnniversaryPanel.

Landing

Open detail →

desktop 1440×900

38-sumi-toi-cvc/landing

mobile 390×706

9:41

38-sumi-toi-cvc

Open →