oh-my-design-cli 1.3.8 → 1.5.0

package/web/references/lunit/DESIGN.md

@@ -0,0 +1,249 @@
+---
+id: lunit
+name: Lunit
+country: KR
+category: healthcare
+homepage: "https://www.lunit.io"
+primary_color: "#1032cf"
+logo:
+  type: favicon
+  slug: "https://www.google.com/s2/favicons?domain=lunit.io&sz=256"
+verified: "2026-05-14"
+omd: "0.1"
+---
+
+# Design System Inspiration of Lunit
+
+## 1. Visual Theme & Atmosphere
+
+Lunit (루닛) is the design language of a **medical AI company that wants to be read like a journal article, not sold like a SaaS**. Where most healthcare-AI marketing leans into either soft-pastel reassurance or bold-pharma authority, Lunit refuses both. The home page opens on pure white anchored by warm-cool gunmetal ink `#232f32` for body and a darker `#151515` for the hero — never pure `#000` for the standing copy. The single saturated accent is a deep electric blue, captured at `#1032cf` and brightening to `#2a4eef`; it appears in cookie consents, system affordances, and the occasional brand band, but is deliberately *withheld* from the primary CTA. The primary CTA is instead a black pill — `#000000` background, `#ffffff` label, `border-radius: 100px`. That black pill is the only rounded thing on the site. Everything else — sections, cards, images, navigation, logo wall, footer — has `border-radius: 0`. This binary radius logic (square surfaces, pill action) is Lunit's geometric thesis.
+
+The typography is the other thesis. Headings are set in **ClashGrotesk** at light weight (400), body text in **Lexend** at weight 300. Both are intentional anti-tropes. ClashGrotesk avoids the "Inter / Söhne / Helvetica Now" tech-startup stamp; Lexend is a typeface engineered specifically to reduce reading fatigue and improve reading proficiency, and choosing it for clinical and oncology copy is itself a statement about audience care. The hero H1 sits at **78px / 84px line-height** in ClashGrotesk 400 — large but not heavy. Pharma marketing typically defaults to semibold or bold weights because legal-grade confidence reads as visual heft; Lunit goes light, which reads as **scientific composure**. Stats land in the same restrained register: `10,000+ Customer Sites · 65+ Countries · 700+ Publications` are placed as quiet typographic facts, not infographic explosions.
+
+Atmosphere is built through **vertical band switching**, not elevation. There are essentially zero drop shadows on the surveyed surfaces. Depth comes from sections claiming full-bleed width and alternating their backgrounds — white → black band → off-white footer (`#eff0f4`) — so the page reads as a sequence of editorial spreads rather than a stack of UI cards. Motion is restrained to AOS scroll-reveal fades; there is no parallax, no autoplay video header, no animated counter. The audience is radiologists, oncology researchers, regulators, and institutional investors — the design choices everywhere read as *we know who is looking*.
+
+**Key Characteristics:**
+- ClashGrotesk + Lexend font pairing — display grotesk + reading-optimized text face, both LIGHT weights as the rule
+- Hero H1 at 78px / 400 weight, body at 18-20px / 300 weight — authority through size and air, not heft
+- Single accent: deep electric blue `#1032cf` (bright sibling `#2a4eef`) — used only for system, cookie, and dark-band moments
+- Primary marketing CTA is **black pill**, not blue — blue is withheld
+- Binary radius rule: `0px` everywhere except the pill CTA at `100px`
+- Warm-cool gunmetal ink `#232f32` for body, near-black `#151515` for heroes — never pure `#000` in standing copy
+- Off-white footer `#eff0f4` — the only branded surface tint
+- Full-bleed band-switching layout — sections alternate white / black / off-white, no card-on-canvas
+- Zero shadows / zero card elevation — depth is band-switching, not floating
+- Uppercase 13.2px Lexend nav — institutional small-caps register, not friendly-app
+
+## 2. Color Palette & Roles
+
+### Primary
+- `#151515` — **Hero ink**. Used for H1 only.
+- `#232f32` — **Body ink**. Warm-cool gunmetal. Default text color across body, nav, footer.
+- `#1032cf` — **Signature blue**. Cookie "Allow all", blue band moments, system-affordance contexts.
+- `#2a4eef` — **Bright blue**. Hover / link / focus sibling of `#1032cf`.
+
+### Surfaces
+- `#ffffff` — Page canvas default.
+- `#000000` — Dark band / primary CTA fill / occasional inverted hero block.
+- `#eff0f4` — Footer surface. The only branded off-white in the system.
+
+### Inverse
+- `#ffffff` — Label on dark CTAs / dark bands.
+
+### Semantic notes
+- **No green for "success", no red for "danger" observed in marketing surfaces.** Lunit's marketing site does not show product UI affordances; semantic colors live inside the clinical products (INSIGHT CXR / DBT / MMG), not on the brand site.
+- **Blue is system, not brand-action.** The brand-action color is black. This is unusual — most B2B health-AI sites use their accent for primary CTAs.
+
+## 3. Typography
+
+### Stack
+```
+display: "ClashGrotesk", system-ui, sans-serif
+text:    "Lexend", system-ui, sans-serif
+fallback: Arial, sans-serif
+```
+
+### Scale (sampled live)
+- **Hero H1** — ClashGrotesk · 78px / 84px · weight 400
+- **Section H2** — ClashGrotesk · ~48–56px · weight 400
+- **Body lg** — Lexend · 20px / 28px · weight 300
+- **Body** — Lexend · 18.4px · weight 300
+- **Body sm** — Lexend · 15px · weight 400
+- **Nav** — Lexend · 13.2px · weight 400 · uppercase
+
+### Rules
+- LIGHT-weight defaults across all heading levels. Bold weights are not part of the brand voice.
+- Body text is Lexend 300 — verify against your runtime if you cannot license Lexend; substitute with Inter 300 at the same metrics if blocked.
+- Nav is uppercase 13.2px with letter tracking — small-cap institutional register.
+- Display copy never wraps mid-noun-phrase in the hero. The H1 break is editorial.
+
+## 4. Radius & Geometry
+
+This section is the brand thesis.
+
+- **Default radius: `0px`.** Every section, image, card, logo tile, input, footer column, and surface that is not a primary action is square-cornered.
+- **Pill radius: `100px`.** Exactly one element rounds: the primary marketing CTA (`Contact Us`). The pill is reserved for the single most human-facing action on the page.
+- **Secondary chip / checkbox:** 3.75px (third-party cookie banner).
+- **No mid-range radii.** No 4px, 6px, 8px, 12px, 16px curves anywhere.
+
+This binary logic is what separates Lunit from peers that use a uniform 8/12px round-everything system.
+
+## 5. Elevation & Depth
+
+- **No shadows.** Across all surveyed sections, `box-shadow` is `none`.
+- Depth is achieved by **full-bleed band switching**:
+  - Section A: white canvas, dark ink
+  - Section B: black canvas, white ink
+  - Section C: off-white `#eff0f4`, dark ink
+- Cards do not float. Logos do not float. The page is read as a sequence of editorial pages, not as a stack of objects.
+
+## 6. Spacing & Rhythm
+
+- Sections are **full viewport width**, edge-to-edge — no max-width "page frame" wrapping the whole document.
+- Vertical rhythm is generous. Headings have substantial top/bottom air; copy blocks are narrow-column to maintain comfortable measure.
+- CTA pill padding ≈ `14px 28px`.
+- Nav item padding ≈ `8–20px` depending on top-row vs main-row.
+
+## 7. Motion
+
+- Library observed: **AOS** (Animate-On-Scroll) — `aos-init aos-animate` classes throughout.
+- Effect set: scroll-triggered fade / fade-up, low amplitude, short duration.
+- **No parallax.** **No autoplay hero video.** **No counter animations on the stats band.**
+- This restraint is itself a positioning signal: motion is a luxury the audience does not need.
+
+## 8. Imagery & Iconography
+
+- **Hero treatment**: Lunit uses dimensional product / scan imagery (chest X-ray fragments, mammography overlays) rendered in a *desaturated, blue-graded* register. The brand's signature blue is allowed to pool inside imagery in a way it is denied to the CTA.
+- **Logo wall**: monochrome grayscale, no background tile, tight kerning.
+- **Icons**: outline-style, single-stroke, no fill. Aligned to the same flat / square geometric thesis.
+- **No stock people imagery, no AI-generated abstract gradients, no hex-mesh "tech" decoration.** The page refuses every B2B-AI cliché.
+
+## 9. Components
+
+### Primary CTA — Pill
+- `background: #000000`
+- `color: #ffffff`
+- `font: Lexend 16.4px / weight ~400`
+- `border-radius: 100px`
+- `padding: ~14px 28px`
+- `border: none`
+- `text-transform: none`
+
+### Secondary nav (top-row)
+- Plain text link, no background, no border
+- `color: #000000` or `#232f32` depending on context
+- `font: Lexend 13.2px / 400 / uppercase`
+
+### Section heading block
+- ClashGrotesk · 48–78px · weight 400
+- Color: `#151515` (hero) or `#232f32` (interior sections)
+- Optional eyebrow above: Lexend 13–15px uppercase
+
+### Stat block (e.g. `10,000+`)
+- ClashGrotesk · large display size
+- Color: `#232f32`
+- Label below in Lexend 15–18px weight 300
+
+### Card (news / solutions)
+- `border-radius: 0px`
+- No shadow
+- Thumbnail at 16:9 or 4:3 above, ClashGrotesk title below, Lexend kicker
+- Hover: subtle ink shift; no lift, no scale
+
+### Footer
+- `background: #eff0f4`
+- `color: #232f32`
+- Column-grid of product / company / legal nav
+- No social-icon row dominance — institutional, not consumer
+
+## 10. Voice
+
+The Lunit voice in your generated work should:
+- **State the science**, then state the consequence. Lead with what the AI does, follow with what changes for the patient or clinician.
+- **Use light typographic weight to carry authority** — do not reach for bold to add confidence.
+- **Avoid emotive verbs** ("battle", "fight", "transform lives") in standing copy. Use precise verbs ("detect", "stratify", "screen", "support").
+- **Refuse exclamation marks. Refuse all-caps shouting (except the institutional nav register).**
+- **Numbers are stated dryly.** "10,000+ Customer Sites" — no exclaim, no "amazing", no decoration.
+
+**Do not copy Lunit's specific marketing taglines, product names, or proprietary clinical claims into derivative work.** Use the structural voice rules above; write fresh copy. Brand assets in this directory are for reference inspection only.
+
+## 11. Layout Patterns
+
+- **Hero band**: full-bleed white. H1 left-aligned (typically), sub-deck below, single pill CTA. No imagery on top of the heading — imagery, if present, sits below the H1 or in a parallel column.
+- **Stats band**: 3 columns, large display numerals, single-line labels. Generous air.
+- **Solutions overview**: editorial card grid, 2-up or 3-up, each card a square-cornered thumbnail + title + 1–2 lines of kicker.
+- **Partnering / testimonial band**: full-bleed logo wall in monochrome, or a quote in ClashGrotesk display size with attribution in Lexend small.
+- **Footer**: off-white `#eff0f4`, multi-column column-nav, no social-feed widgets, no newsletter signup dominance.
+
+## 12. What This System Refuses
+
+The negative space is as informative as the positive choices. The Lunit system explicitly does not use:
+- Rounded cards (12 / 16 / 20px) of any kind
+- Drop shadows or elevation
+- Saturated blue on primary CTAs (the brand color is *withheld* from action)
+- Bold typographic weights for confidence
+- Hero video autoplay
+- Stock photography of "diverse smiling teams"
+- Hex-mesh / circuit-board / neural-net visual cliché
+- Multi-accent palettes (green + blue + orange "tech" mixes)
+- Exclamation marks or emotive marketing verbs
+
+When you generate work in the Lunit register, treat this refusal list as a hard filter.
+
+## 13. When to Reach for This System
+
+Choose Lunit-style when the brief is:
+- A medical / clinical / regulated-industry product targeting expert audiences (clinicians, researchers, regulators, institutional buyers)
+- A research-grade B2B product where credibility must read as **scientific composure**, not sales energy
+- A category whose competitors lean either soft-pastel-reassuring or bold-pharma — and you want to position above both
+- A product where the user is reading carefully and slowly, not scrolling fast
+
+Avoid Lunit-style when the brief is consumer fintech, lifestyle commerce, social, or anywhere the audience expects warm-friendly app idioms.
+
+## 14. Token Reference
+
+See `assets/_reference/tokens.json`, `fonts.json`, `structure.json` for machine-readable token sets sampled live on 2026-05-14 from `https://www.lunit.io/`.
+
+See `assets/_reference/.live-inspect-proof.json` for the raw CDP `getComputedStyle` samples (≥5 per requirement; 8 captured).
+
+## 15. Verification & Sources
+
+**Verified:** 2026-05-14
+
+### Tier 1 — Live inspect (REQUIRED · COMPLETED)
+- **Method:** Chrome DevTools Protocol :9222, `Runtime.evaluate` + `getComputedStyle` on production DOM
+- **Surface:** `https://www.lunit.io/` (English root)
+- **Captured:** hero H1, 7 major `<section>` elements, stats band, 5 CTA candidates, 4 nav links, 3 body paragraphs, footer, html/body roots, plus 23 targeted samples — **8 samples retained as `.live-inspect-proof.json` raw_samples** (requirement: ≥5)
+- **Confidence:** HIGH for color, type, radius, elevation. MEDIUM for spacing (only viewport-relative measured).
+
+### Tier 1 — Official Design System lookup (REQUIRED · NEGATIVE RESULT documented)
+- **Attempted:** `design.lunit.io` → DNS fails (HTTP 000, no such subdomain)
+- **Attempted:** Lunit GitHub org `github.com/lunit-io` → 10 public repos enumerated (`archon`, `benchmark-ssl-pathology`, `CoEval`, `dicom-rs`, `lumberjack`, `mmg-model-nia`, `nlst-nodule-detection`, `ocelot23algo`, `openslide`, `spec-cxr`) — all medical-imaging / ML research code, **no design-system / tokens / component-library / Storybook repo**
+- **Attempted:** keyword scan of `www.lunit.io` HTML for `design-system / design-tokens / brand-guidelines / lunit-ui / storybook` → no hits (the only match was a generic "Figma" string in cookie-vendor copy)
+- **Conclusion:** Lunit does not publish an open design system, Storybook, or brand-guidelines site as of 2026-05-14. This is consistent with their positioning (clinical / regulated / B2B medical AI — they have no incentive to ship a public DS).
+
+### Tier 2 — 3rd-party DS directories
+- `getdesign.md/lunit` — not present
+- `styles.refero.design/?q=lunit` — not present
+- **Both empty.** Consistent with Tier-2 directory bias against Korean and against B2B-clinical brands.
+
+### Tier 3 — Brand-published narrative / blog
+- `www.lunit.io/en/about/`, `www.lunit.io/en/careers/` — corporate narrative pages, no DS content
+- No public Lunit tech-blog or Medium account observed
+- Investor-relations pages exist (`investors.lunit.io` referenced indirectly) but contain no design content
+
+### Tier 4 — Stack fingerprint (observed)
+- **CMS:** WordPress + Oxygen Builder (`oxy-*` and `ct-*` class prefixes confirm)
+- **Scroll motion:** AOS (`aos-init aos-animate`)
+- **Fonts:** Lexend (likely Google Fonts), ClashGrotesk (likely Fontshare / Indian Type Foundry)
+- **Analytics:** Google, HubSpot, Microsoft (per cookie-consent disclosure)
+- **CSS custom properties:** only WordPress defaults (`--wp-*`, `--wp--preset--*`) — no Lunit-namespaced custom properties exported globally, which corroborates the "no public DS" finding
+
+### Tier 5 — IP & licensing notes
+- All brand assets in `assets/_reference/` are **for reference inspection only**.
+- **No verbatim taglines** from `www.lunit.io` are reproduced in this DESIGN.md. The voice rules in §10 paraphrase structural patterns only.
+- Section names in `structure.json` are quoted because they describe page anatomy, not brand copy; generated work must produce its own headings.
+- Lexend is OFL-licensed (free for commercial). ClashGrotesk is free via Fontshare for commercial use under their license — verify license terms before shipping derivative work.
+
+### Conflicts unresolved
+- None. All Tier 1 measurements are internally consistent (single source = live DOM on 2026-05-14).

package/web/references/mercari/DESIGN.md

@@ -1,6 +1,15 @@
 ---
-omd: 0.1
-brand: Mercari
+id: mercari
+name: Mercari
+country: JP
+category: consumer-tech
+homepage: "https://www.mercari.com"
+primary_color: "#ff0211"
+logo:
+  type: github
+  slug: mercari
+verified: "2026-05-15"
+omd: "0.1"
 ---
 
 # Design System Inspiration of Mercari

package/web/references/minimax/DESIGN.md

@@ -1,3 +1,17 @@
+---
+id: minimax
+name: Minimax
+country: US
+category: ai
+homepage: "https://www.minimaxi.com"
+primary_color: "#000000"
+logo:
+  type: simpleicons
+  slug: minimax
+verified: "2026-05-15"
+omd: "0.1"
+---
+
 # Design System Inspiration of MiniMax
 
 ## 1. Visual Theme & Atmosphere

package/web/references/mintlify/DESIGN.md

@@ -1,3 +1,17 @@
+---
+id: mintlify
+name: Mintlify
+country: US
+category: productivity
+homepage: "https://mintlify.com"
+primary_color: "#0d9373"
+logo:
+  type: simpleicons
+  slug: mintlify
+verified: "2026-05-15"
+omd: "0.1"
+---
+
 # Design System Inspiration of Mintlify
 
 ## 1. Visual Theme & Atmosphere

package/web/references/miro/DESIGN.md

@@ -1,3 +1,23 @@
+---
+id: miro
+name: Miro
+country: US
+category: design-tools
+homepage: "https://miro.com"
+primary_color: "#ffd02f"
+logo:
+  type: simpleicons
+  slug: miro
+verified: "2026-05-15"
+omd: "0.1"
+ds:
+  name: Mirotone
+  url: "https://mirotone.xyz"
+  type: system
+  description: Miro's CSS component library for apps built on the Miro platform.
+  og_image: "https://www.mirotone.xyz/cover.png"
+---
+
 # Design System Inspiration of Miro
 
 ## 1. Visual Theme & Atmosphere

package/web/references/mistral.ai/DESIGN.md

@@ -1,3 +1,23 @@
+---
+id: mistral.ai
+name: Mistral AI
+country: FR
+category: ai
+homepage: "https://mistral.ai"
+primary_color: "#ff7000"
+logo:
+  type: simpleicons
+  slug: mistralai
+verified: "2026-05-15"
+omd: "0.1"
+ds:
+  name: Mistral Brand
+  url: "https://mistral.ai/brand"
+  type: brand
+  description: Mistral AI's logo, colors, typography, and brand asset kit.
+  og_image: "https://mistral.ai/-/brand/opengraph-image-1robrb.png"
+---
+
 # Design System Inspiration of Mistral AI
 
 ## 1. Visual Theme & Atmosphere

package/web/references/mongodb/DESIGN.md

@@ -1,3 +1,22 @@
+---
+id: mongodb
+name: Mongodb
+country: US
+category: backend-devops
+homepage: "https://www.mongodb.com"
+primary_color: "#00ed64"
+logo:
+  type: simpleicons
+  slug: mongodb
+verified: "2026-05-15"
+omd: "0.1"
+ds:
+  name: LeafyGreen
+  url: "https://www.mongodb.design"
+  type: system
+  description: MongoDB's open-source design system with an extensive React component library.
+---
+
 # Design System Inspiration of MongoDB
 
 ## 1. Visual Theme & Atmosphere

package/web/references/musinsa/DESIGN.md

@@ -1,6 +1,15 @@
 ---
-omd: 0.1
-brand: Musinsa
+id: musinsa
+name: Musinsa
+country: KR
+category: ecommerce
+homepage: "https://www.musinsa.com"
+primary_color: "#000000"
+logo:
+  type: favicon
+  slug: "https://www.google.com/s2/favicons?domain=musinsa.com&sz=128"
+verified: "2026-05-15"
+omd: "0.1"
 ---
 
 # Design System Inspiration of Musinsa (무신사)

package/web/references/naver/DESIGN.md

@@ -1,6 +1,21 @@
 ---
-omd: 0.1
-brand: Naver
+id: naver
+name: Naver
+country: KR
+category: consumer-tech
+homepage: "https://www.naver.com"
+primary_color: "#000000"
+logo:
+  type: simpleicons
+  slug: naver
+verified: "2026-05-15"
+omd: "0.1"
+ds:
+  name: NAVER Brand Resource
+  url: "https://www.navercorp.com/en/company/brandGuide"
+  type: brand
+  description: "NAVER Corp's official brand guide — logo usage, NAVER Green #03C75A, and identity rules."
+  og_image: "https://www.navercorp.com/img/og/OG_TAG_1_Main.png"
 ---
 
 # Design System Inspiration of Naver (네이버)

package/web/references/notion/DESIGN.md

@@ -1,6 +1,15 @@
 ---
-omd: 0.1
-brand: Notion
+id: notion
+name: Notion
+country: US
+category: productivity
+homepage: "https://www.notion.so"
+primary_color: "#000000"
+logo:
+  type: simpleicons
+  slug: notion
+verified: "2026-05-15"
+omd: "0.1"
 ---
 
 # Design System Inspiration of Notion

package/web/references/nvidia/DESIGN.md

@@ -1,6 +1,15 @@
 ---
-omd: 0.1
-brand: NVIDIA
+id: nvidia
+name: NVIDIA
+country: US
+category: consumer-tech
+homepage: "https://www.nvidia.com"
+primary_color: "#76b900"
+logo:
+  type: simpleicons
+  slug: nvidia
+verified: "2026-05-15"
+omd: "0.1"
 ---
 
 # Design System Inspiration of NVIDIA

package/web/references/ohouse/DESIGN.md

@@ -1,6 +1,15 @@
 ---
-omd: 0.1
-brand: Ohouse
+id: ohouse
+name: Ohouse
+country: KR
+category: consumer-tech
+homepage: "https://ohou.se"
+primary_color: "#000000"
+logo:
+  type: favicon
+  slug: "https://www.google.com/s2/favicons?domain=ohou.se&sz=128"
+verified: "2026-05-15"
+omd: "0.1"
 ---
 
 # Design System Inspiration of Ohouse (오늘의집)