oh-my-design-cli 1.6.6 → 1.7.0

package/web/references/gmarket/DESIGN.md

@@ -16,6 +16,57 @@ ds:
   url: "https://corp.gmarket.com/fonts/"
   type: brand
   description: "Gmarket's SIL OFL brand typeface — 3 weights, TTF/OTF, 11,172 KR glyphs. First-party font artifact from a 25-year-old open marketplace; backing 247 :root CSS vars + Smile Yellow #ffd200 + Club/Event/Service sub-systems on the storefront."
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    primary: "#da120d"
+    brand: "#da120d"
+    error: "#ef2b2a"
+    canvas: "#ffffff"
+    surface: "#ffffff"
+    foreground: "#222222"
+    muted: "#757575"
+    on-primary: "#ffffff"
+    hairline: "#e0e0e0"
+    success: "#00c400"
+    accent-smile: "#ffd200"
+    accent-stardelivery: "#7130f3"
+    accent-connect: "#00c3a0"
+    club-navy: "#002041"
+    club-blue: "#497cff"
+    event-bf: "#f1266d"
+    event-bs: "#fd4e28"
+    event-bsd: "#7b00e7"
+  typography:
+    family: { sans: "Gmarket Sans", mono: "system-ui" }
+    section-hero:  { size: 28, weight: 700, lineHeight: 1.2, use: "Hero module section H2" }
+    section-compact: { size: 24, weight: 700, lineHeight: 1.2, use: "Compact module H2" }
+    card-title:    { size: 18.72, weight: 700, lineHeight: 1.3, use: "Card H3 heading" }
+    body:          { size: 16, weight: 400, lineHeight: 1.5, use: "Body, card title, primary nav" }
+    body-strong:   { size: 16, weight: 700, lineHeight: 1.4, use: "Price emphasis, strong body" }
+    secondary:     { size: 14, weight: 400, lineHeight: 1.4, use: "Secondary nav, filter/utility" }
+    utility:       { size: 13.3333, weight: 400, lineHeight: 1.4, use: "Utility text, tooltip, swiper label" }
+    meta:          { size: 12, weight: 400, lineHeight: 1.4, use: "Meta text, footer notices, micro-badge" }
+    price-modifier: { size: 11, weight: 500, lineHeight: 1.4, use: "Price-modifier label 쿠폰적용가" }
+  spacing: { micro: 4, sm: 8, md: 16, lg: 24, module: 64 }
+  rounded: { sm: 3, md: 4, lg: 20, full: 9999 }
+  shadow:
+    none: "none"
+  components_harvested: true
+  components:
+    button-primary: { type: button, bg: "#da120d", fg: "#ffffff", radius: "4px", padding: "14px 24px", font: "16px / 700", use: "Highest-intent purchase CTA, one per surface" }
+    button-secondary: { type: button, bg: "#ffffff", fg: "#222222", border: "1px solid #e0e0e0", radius: "3px", font: "14px / 400", use: "Chrome-utility actions, footer button" }
+    button-pill: { type: button, bg: "#ffffff", fg: "#666666", border: "1px solid #e0e0e0", radius: "20px", font: "16px / 400", states: "active fg #222222", use: "Home module entry pills, GNB sub-category chips" }
+    input-search: { type: input, bg: "#ffffff", fg: "#222222", border: "2px solid #222222", radius: "0px", height: "44px", font: "16px / 400", use: "Header search field, signature dark-stroked" }
+    input-filter: { type: input, bg: "#ffffff", border: "1px solid #e0e0e0", radius: "3px", font: "14px / 400", use: "Filter / sort refinement strip" }
+    card-product: { type: card, bg: "#ffffff", radius: "6px", shadow: "none", padding: "8px 0", use: "Home / bestsellers product card; title #222222, price #da120d 700, separation via gutter not shadow" }
+    badge-discount: { type: badge, bg: "#fff5f5", fg: "#da120d", radius: "3px", font: "12px / 700", use: "Discount-rate badge, percentage-off" }
+    badge-club: { type: badge, bg: "#002041", fg: "#ffd200", radius: "4px", font: "11px / 700", use: "Smile Club loyalty badge" }
+    chip-delivery: { type: badge, bg: "#ffd200", fg: "#222222", radius: "3px", padding: "2px 6px", font: "11px / 500", use: "스마일배송 yellow chip; 무료배송 gray #f5f5f5, StarDelivery purple #7130f3 w/ white text" }
+    nav-anchor: { type: tab, fg: "#222222", padding: "17px 0px 20px", font: "16px / 400", active: "current fg #da120d, 2px bottom border #222222 on hover", use: "GNB top primary anchor" }
+    layer-recent: { type: dialog, bg: "#ffffff", border: "1px solid #e0e0e0", shadow: "none", use: "Recent-products layer; title 16px/700 #222222" }
+    banner-event: { type: card, bg: "#f1266d", fg: "#ffffff", use: "BF/BS/BSD full-bleed event-week module; BS #fd4e28, BSD #7b00e7" }
 ---
 
 # Design System Inspiration of Gmarket (지마켓)

package/web/references/gogolook/DESIGN.md

@@ -7,7 +7,7 @@ homepage: "https://whoscall.com"
 primary_color: "#0CD25F"
 logo:
   type: favicon
-  slug: "https://www.google.com/s2/favicons?domain=whoscall.com&sz=128"
+  slug: "https://cdn.prod.website-files.com/6824b7a0497f20e292c20ff9/68ac49dd7f01530f6ef06b10_Webclip.png"
 verified: "2026-06-01"
 omd: "0.1"
 ds:
@@ -15,6 +15,30 @@ ds:
   url: "https://whoscall.com/en/brand"
   type: brand
   description: Whoscall's official brand page — logo, the documented brand green #0CD25F, and usage guidelines.
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    brand: "#0cd25f"
+    cta: "#05f067"
+    brand-tint: "#e6faef"
+    dark-gray: "#2c3e50"
+    text: "#262626"
+    canvas: "#ffffff"
+    accent-pink: "#f53f90"
+    accent-teal: "#019d91"
+  typography:
+    family: { sans: "Noto Sans", mono: "Noto Sans" }
+    hero:    { size: 118, weight: 500, lineHeight: 1.1, use: "Nunito rounded display hero" }
+    body:    { size: 16, weight: 400, lineHeight: 1.5, use: "Noto Sans body copy" }
+    button:  { size: 16, weight: 500, lineHeight: 1.0, use: "Pill button label" }
+  spacing: { xs: 8, sm: 16, base: 16, lg: 32, xl: 48, section: 64 }
+  rounded: { sm: 40, md: 40, lg: 100, full: 9999 }
+  components:
+    button-primary: { type: button, bg: "#05f067", fg: "#262626", radius: "100px", padding: "16px 32px", font: "16px / 500", use: "Primary download CTA pill, 56px height" }
+    button-secondary: { type: button, bg: "rgba(255,255,255,0.8)", fg: "#262626", radius: "100px", padding: "16px 32px", font: "16px / 500", use: "Secondary demo pill, 56px height" }
+    button-premium: { type: button, bg: "#e6faef", fg: "#262626", radius: "40px", padding: "16px 32px", font: "16px / 400", use: "Premium / upgrade action on light-green surface, 57px height" }
+  components_harvested: true
 ---
 # Design System Inspiration of Gogolook
 

package/web/references/gogoro/DESIGN.md

@@ -10,6 +10,44 @@ logo:
   slug: "https://www.google.com/s2/favicons?domain=gogoro.com&sz=128"
 verified: "2026-05-19"
 omd: "0.1"
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    canvas: "#000000"
+    text: "#323237"
+    ink: "#141719"
+    accent: "#0074ff"
+    cyan: "#28c3ff"
+    cta: "#2b96ed"
+    surface: "#f6f6f6"
+    on-dark: "#ffffff"
+    gray-mid: "#737d82"
+    gray-light: "#b9bcbf"
+    gray-faint: "#888888"
+    border: "#dee2e6"
+  typography:
+    family: { sans: "Graphik", mono: "Graphik" }
+    display:  { size: 60, weight: 700, lineHeight: 1.05, use: "Full-bleed hero statements, tight tracking" }
+    h1:       { size: 42, weight: 700, lineHeight: 1.1, use: "Section openers" }
+    h2:       { size: 30, weight: 700, lineHeight: 1.2, use: "Sub-sections" }
+    h3:       { size: 22, weight: 600, lineHeight: 1.3, use: "Card titles, spec headers" }
+    body-lg:  { size: 18, weight: 400, lineHeight: 1.5, use: "Lead paragraphs" }
+    body:     { size: 16, weight: 400, lineHeight: 1.5, use: "Default copy" }
+    caption:  { size: 14, weight: 500, lineHeight: 1.4, use: "Meta, captions, button text" }
+    micro:    { size: 12, weight: 500, lineHeight: 1.3, use: "Legal, fine print" }
+  spacing: { xs: 8, sm: 16, base: 24, lg: 28, xl: 48, section: 100 }
+  rounded: { sm: 8, md: 12, lg: 16, full: 9999 }
+  shadow:
+    card: "0 2px 12px rgba(0,0,0,0.08)"
+  components:
+    button-cta: { type: button, bg: "#2b96ed", fg: "#ffffff", radius: "12px", padding: "0 24px", font: "14px / 600", use: "Account / login / primary site CTA, 40px height" }
+    button-marketing: { type: button, bg: "#0074ff", fg: "#ffffff", radius: "12px", padding: "14px 28px", font: "16px / 600", use: "Hero CTA over black / photo backgrounds" }
+    button-outline: { type: button, bg: "transparent", fg: "#323237", radius: "12px", padding: "14px 28px", font: "16px / 600", use: "Lower-priority action, 1px #dee2e6 border" }
+    input-default: { type: input, bg: "#ffffff", fg: "#323237", radius: "8px", padding: "12px 16px", font: "16px / 400", use: "Account / form input; focus border #0074ff" }
+    card-spec: { type: card, bg: "#ffffff", radius: "16px", padding: "24px", use: "Product / spec card on light surface" }
+    card-dark: { type: card, bg: "#141719", fg: "#ffffff", radius: "16px", use: "On-black storytelling card with electric-blue accent" }
+  components_harvested: true
 ---
 
 # Design System Inspiration of Gogoro

package/web/references/grip/DESIGN.md

@@ -10,6 +10,45 @@ logo:
   slug: "https://www.google.com/s2/favicons?domain=grip.show&sz=256"
 verified: "2026-06-03"
 omd: "0.1"
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    primary: "#eb2b51"
+    hot-pink: "#ff3c78"
+    purple: "#6456dc"
+    canvas: "#0e1011"
+    surface-1: "#17181a"
+    surface-2: "#222327"
+    surface-3: "#404149"
+    surface-light: "#ffffff"
+    surface-subtle: "#f3f3f3"
+    text-primary: "#eff0f4"
+    text-body: "#323232"
+    text-muted: "#999999"
+    text-subdued: "#666666"
+    border: "#e5e5e5"
+    border-subtle: "#d5d5d5"
+    error: "#ef4343"
+  typography:
+    family: { sans: "Pretendard", mono: "Pretendard" }
+    discount: { size: 27, weight: 700, lineHeight: 1.35, use: "Discount price, coupon amount" }
+    confirm:  { size: 18, weight: 500, lineHeight: 1.4, use: "Full-width confirm button" }
+    button:   { size: 16, weight: 600, lineHeight: 1.4, use: "Primary button label" }
+    body:     { size: 15, weight: 400, lineHeight: 1.4, use: "Body, product name" }
+    caption:  { size: 13, weight: 400, lineHeight: 1.4, use: "Caption, meta" }
+    badge:    { size: 12, weight: 500, lineHeight: 1.4, use: "Badge, tag" }
+  spacing: { xs: 4, sm: 8, md: 12, base: 16, lg: 24, xl: 32, section: 56 }
+  rounded: { sm: 4, md: 6, lg: 8, full: 9999 }
+  components:
+    button-primary: { type: button, bg: "#eb2b51", fg: "#ffffff", radius: "8px", font: "16px / 600", use: "Primary CTA / cart checkout, 50px height" }
+    button-confirm: { type: button, bg: "#eb2b51", fg: "#ffffff", radius: "8px", font: "18px / 500", use: "Full-width drawer-bottom confirm, 56px height" }
+    button-secondary: { type: button, bg: "#323232", fg: "#ffffff", radius: "4px", font: "14px / 500", use: "Dark secondary buy-now inline, 34px height" }
+    button-outline: { type: button, bg: "#ffffff", fg: "#323232", radius: "4px", font: "14px / 500", use: "Outline delete / cancel, 1px #e5e5e5 border, 34px height" }
+    button-discovery: { type: button, bg: "#17181a", fg: "#ffffff", radius: "6px", font: "15px / 600", use: "Shorts / discovery CTA, 40px height" }
+    card-coupon: { type: card, bg: "#fff5f8", fg: "#eb2b51", font: "27px / 700", use: "Active coupon card, rose-red amount" }
+    nudge-urgency: { type: toast, bg: "rgba(47,23,253,0.05)", fg: "#6456dc", radius: "4px", font: "14px / 500", use: "Urgency countdown nudge bar, 38px height" }
+  components_harvested: true
 ---
 
 # Grip

package/web/references/hahow/DESIGN.md

@@ -15,6 +15,32 @@ ds:
   url: "https://github.com/hahow/hahow-design"
   type: system
   description: "Hahow's open-source design-system theme — Primary/Secondary token scales (Primary 500 #00ccb4)."
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    primary: "#00ccb4"
+    primary-100: "#a3ffe8"
+    primary-400: "#23d9bd"
+    primary-800: "#006166"
+    primary-900: "#00444d"
+    secondary: "#ffb940"
+    canvas: "#f5f7f9"
+    text: "#262626"
+    promo-orange: "#fa8c16"
+    coral: "#f65f55"
+  typography:
+    family: { sans: "PingFang TC", mono: "PingFang TC" }
+    heading: { size: 24, weight: 600, lineHeight: 1.3, use: "Section headings" }
+    body:    { size: 16, weight: 400, lineHeight: 1.5, use: "Primary body text" }
+    chip:    { size: 14, weight: 400, lineHeight: 1.4, use: "Tag / chip labels" }
+  spacing: { xs: 4, sm: 8, base: 16, lg: 24, xl: 32, section: 48 }
+  rounded: { sm: 8, md: 8, lg: 20, full: 9999 }
+  components:
+    button-primary: { type: button, bg: "transparent", fg: "#00ccb4", radius: "8px", font: "16px / 600", use: "Teal outline primary CTA, 2px #dcf9f3 border, 42px height" }
+    button-card: { type: button, bg: "#ffffff", fg: "#595959", radius: "8px", use: "Neutral white card-level action" }
+    chip-tag: { type: badge, bg: "rgba(0,0,0,0.04)", fg: "rgba(0,0,0,0.65)", radius: "20px", font: "14px / 400", use: "Metadata, category, filter tags, 33px height" }
+  components_harvested: true
 ---
 
 # Design System Inspiration of Hahow

package/web/references/hashicorp/DESIGN.md

@@ -15,6 +15,48 @@ ds:
   url: "https://helios.hashicorp.design"
   type: system
   description: HashiCorp's design system documenting components and foundations.
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    brand: "#000000"
+    dark: "#15181e"
+    dark-deep: "#0d0e12"
+    canvas: "#ffffff"
+    surface-light: "#f1f2f3"
+    border: "#d5d7db"
+    helper: "#656a76"
+    body: "#3b3d45"
+    on-dark: "#efeff1"
+    link: "#2264d6"
+    link-on-dark: "#1060ff"
+    link-bright: "#2b89ff"
+    terraform: "#7b42bc"
+    vault: "#ffcf25"
+    waypoint: "#14c6cb"
+    waypoint-hover: "#12b6bb"
+    vagrant: "#1868f2"
+    badge-bg: "#42225b"
+  typography:
+    family: { sans: "HashiCorp Sans", fallback: "system-ui, sans-serif" }
+    display-hero: { size: 82, weight: 600, lineHeight: 1.17, use: "Hero headline, kern enabled" }
+    heading:      { size: 26, weight: 700, lineHeight: 1.19, use: "Card / product titles" }
+    body:         { size: 16, weight: 400, lineHeight: 1.63, use: "Standard reading text, system-ui" }
+    label:        { size: 13, weight: 600, tracking: 1.3, use: "Uppercase section labels, letter-spaced" }
+  spacing: { xs: 4, sm: 8, md: 12, base: 16, lg: 24, xl: 32, xxl: 48, section: 64 }
+  rounded: { sm: 2, md: 5, lg: 8, full: 9999 }
+  shadow:
+    micro: "rgba(97,104,117,0.05) 0px 1px 1px, rgba(97,104,117,0.05) 0px 2px 2px"
+  components:
+    button-primary: { type: button, bg: "#15181e", fg: "#d5d7db", radius: 5, padding: "9px 15px", use: "Primary dark CTA" }
+    button-secondary: { type: button, bg: "#ffffff", fg: "#3b3d45", radius: 4, padding: "8px 12px", use: "Secondary white button" }
+    button-terraform: { type: button, bg: "#7b42bc", fg: "#ffffff", radius: 5, use: "Terraform product button" }
+    button-waypoint: { type: button, bg: "#14c6cb", fg: "#0d0e12", radius: 5, use: "Waypoint product button" }
+    badge: { type: badge, bg: "#42225b", fg: "#efeff1", radius: 5, padding: "3px 7px", font: "16px", use: "Deep purple pill badge" }
+    input-dark: { type: input, bg: "#0d0e12", fg: "#efeff1", radius: 5, padding: "11px", use: "Dark-mode text input" }
+    card: { type: card, bg: "#ffffff", radius: 8, use: "Light card with micro-shadow elevation" }
+    nav-link: { type: tab, fg: "#3b3d45", font: "15px weight 500", use: "Horizontal nav link, system-ui" }
+  components_harvested: true
 ---
 
 # Design System Inspiration of HashiCorp

package/web/references/hogangnono/DESIGN.md

@@ -10,6 +10,47 @@ logo:
   slug: "https://www.google.com/s2/favicons?domain=hogangnono.com&sz=256"
 verified: "2026-06-03"
 omd: "0.1"
+tokens:
+  source: prose-derived
+  extracted: "2026-06-09"
+  colors:
+    primary: "#584de4"
+    primary-nav: "#4d55b2"
+    primary-tint: "#f3f4fc"
+    primary-light: "#eeedfc"
+    price-accent: "#4337de"
+    heading: "#333333"
+    body: "#4f4f4f"
+    caption: "#6e6e6e"
+    muted: "#b3b3b3"
+    border: "#e5e5e5"
+    surface-chip: "#f3f3f3"
+    canvas: "#f9f9f9"
+    white: "#ffffff"
+    info: "#3e8ce8"
+    success: "#3dab6a"
+    danger: "#ee3a3a"
+  typography:
+    family: { sans: "Pretendard", fallback: "Apple SD Gothic Neo, NanumGothic, sans-serif" }
+    modal-heading: { size: 30, weight: 700, lineHeight: 1.33, use: "Large modal heading" }
+    section:       { size: 22, weight: 700, use: "Section headings" }
+    list-title:    { size: 17, weight: 600, use: "List item titles" }
+    price:         { size: 19, weight: 500, use: "Apartment listing price display" }
+    body:          { size: 16, weight: 400, lineHeight: 1.3, use: "Base body text" }
+    caption:       { size: 13, weight: 400, use: "Caption / badge" }
+  spacing: { xs: 4, sm: 8, md: 12, base: 16, lg: 24, xl: 32, xxl: 48, section: 64 }
+  rounded: { sm: 4, md: 6, lg: 12, full: 9999 }
+  shadow:
+    button: "rgba(89,99,217,0.3) 0px 4px 5px 0px"
+  components:
+    button-primary: { type: button, bg: "#584de4", fg: "#ffffff", radius: 6, font: "17px", use: "Primary fill action, 50px tall" }
+    button-tint: { type: button, bg: "#f3f4fc", fg: "#584de4", radius: 6, font: "17px", use: "Secondary tint button" }
+    button-disabled: { type: button, bg: "#f0f0f0", fg: "#dadada", radius: 6, use: "Disabled primary state" }
+    chip-info: { type: badge, bg: "#eeedfc", fg: "#584de4", use: "Info chip / subtle fill" }
+    badge-up: { type: badge, fg: "#3dab6a", use: "Positive up-trend price indicator" }
+    badge-down: { type: badge, fg: "#ee3a3a", use: "Negative down-trend price indicator" }
+    card: { type: card, bg: "#ffffff", radius: 6, use: "Card surface with gentle elevation" }
+  components_harvested: true
 ---
 
 # Hogangnono