oh-my-design-cli 1.8.7 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (247) hide show
  1. package/.claude/hooks/lib/preferences-parser.cjs +1 -0
  2. package/.claude/hooks/lib/preferences-writer.cjs +1 -0
  3. package/.claude/hooks/post-edit-watch.cjs +1 -0
  4. package/.claude/hooks/session-end-foldin.cjs +1 -0
  5. package/.claude/hooks/session-state-loader.cjs +1 -0
  6. package/.claude/hooks/skill-activation.cjs +1 -0
  7. package/.claude/settings.json +10 -1
  8. package/.github/assets/logo-bg.png +0 -0
  9. package/AGENTS.md +20 -1
  10. package/CHANGELOG.md +482 -0
  11. package/MIGRATION.md +103 -0
  12. package/README.ja.md +56 -19
  13. package/README.ko.md +47 -30
  14. package/README.md +48 -30
  15. package/README.zh-TW.md +59 -22
  16. package/agents/AGENT.md +8 -7
  17. package/agents/omd-codex-image.md +1 -1
  18. package/agents/omd-critic.md +6 -7
  19. package/agents/omd-designer-review.md +1 -1
  20. package/agents/omd-final-qa.md +1 -1
  21. package/agents/omd-humanizer.md +38 -0
  22. package/agents/omd-kr-writer.md +3 -4
  23. package/agents/omd-locale-adapter.md +12 -16
  24. package/agents/omd-master.md +24 -19
  25. package/agents/omd-microcopy.md +1 -1
  26. package/agents/omd-orchestrator.md +7 -8
  27. package/agents/omd-slop-auditor.md +31 -0
  28. package/agents/omd-ux-researcher.md +1 -1
  29. package/data/reference-fingerprints.json +1995 -38
  30. package/dist/bin/oh-my-design.js +16 -8
  31. package/dist/bin/oh-my-design.js.map +1 -1
  32. package/dist/chunk-UJIHCEYF.js +99 -0
  33. package/dist/chunk-UJIHCEYF.js.map +1 -0
  34. package/dist/doctor-LDWSFM3I.js +763 -0
  35. package/dist/doctor-LDWSFM3I.js.map +1 -0
  36. package/dist/install-skills-ZZFNJ2II.js +1120 -0
  37. package/dist/install-skills-ZZFNJ2II.js.map +1 -0
  38. package/docs/CLI_QUICKSTART.md +157 -0
  39. package/package.json +25 -4
  40. package/scripts/postinstall.cjs +5 -4
  41. package/skills/claude-design/SKILL.md +38 -14
  42. package/skills/claude-design/references/claude-design-flow.md +11 -11
  43. package/skills/claude-design/references/codebase-analysis.md +5 -4
  44. package/skills/omd-final-qa/SKILL.md +1 -1
  45. package/skills/omd-harness/SKILL.md +51 -50
  46. package/skills/omd-humanize/SKILL.md +116 -0
  47. package/skills/omd-humanize/agents/openai.yaml +4 -0
  48. package/skills/omd-humanize/references/locale-playbooks.md +102 -0
  49. package/skills/omd-humanize/references/sources.md +11 -0
  50. package/skills/omd-init/SKILL.md +18 -12
  51. package/skills/omd-locale-adapter/SKILL.md +58 -91
  52. package/skills/omd-orchestrator/SKILL.md +11 -5
  53. package/skills/omd-reference-capture/SKILL.md +80 -26
  54. package/skills/omd-reference-capture/scripts/PLAYWRIGHT-LICENSE.txt +202 -0
  55. package/skills/omd-reference-capture/scripts/PLAYWRIGHT-NOTICE.txt +5 -0
  56. package/skills/omd-reference-capture/scripts/THIRD_PARTY_NOTICES.md +3 -0
  57. package/skills/omd-reference-capture/scripts/capture-reference-evidence.mjs +159906 -0
  58. package/skills/omd-slop-audit/SKILL.md +110 -0
  59. package/skills/omd-slop-audit/agents/openai.yaml +4 -0
  60. package/skills/omd-slop-audit/references/pattern-catalog.md +96 -0
  61. package/skills/omd-slop-audit/references/sources.md +24 -0
  62. package/web/references/104/DESIGN.md +354 -0
  63. package/web/references/11st/DESIGN.md +197 -316
  64. package/web/references/29cm/DESIGN.md +297 -393
  65. package/web/references/42dot/DESIGN.md +390 -0
  66. package/web/references/8percent/DESIGN.md +438 -0
  67. package/web/references/ably/DESIGN.md +267 -572
  68. package/web/references/acer/DESIGN.md +329 -0
  69. package/web/references/airbnb/DESIGN.md +219 -557
  70. package/web/references/alipay/DESIGN.md +179 -420
  71. package/web/references/apple/DESIGN.md +224 -498
  72. package/web/references/asleep/DESIGN.md +402 -0
  73. package/web/references/au/DESIGN.md +334 -0
  74. package/web/references/autopedia/DESIGN.md +382 -0
  75. package/web/references/aws-cloudscape/DESIGN.md +241 -0
  76. package/web/references/baemin/DESIGN.md +332 -491
  77. package/web/references/banksalad/DESIGN.md +269 -180
  78. package/web/references/barogo/DESIGN.md +416 -0
  79. package/web/references/beusable/DESIGN.md +464 -0
  80. package/web/references/bilibili/DESIGN.md +206 -374
  81. package/web/references/bmw/DESIGN.md +162 -276
  82. package/web/references/brandi/DESIGN.md +184 -325
  83. package/web/references/catchtable/DESIGN.md +219 -264
  84. package/web/references/cgv/DESIGN.md +317 -0
  85. package/web/references/channeltalk/DESIGN.md +210 -336
  86. package/web/references/china-airlines/DESIGN.md +291 -0
  87. package/web/references/cjonstyle/DESIGN.md +453 -0
  88. package/web/references/class101/DESIGN.md +168 -387
  89. package/web/references/classum/DESIGN.md +228 -203
  90. package/web/references/claude/DESIGN.md +242 -479
  91. package/web/references/clay/DESIGN.md +179 -377
  92. package/web/references/clickhouse/DESIGN.md +254 -343
  93. package/web/references/cohere/DESIGN.md +214 -324
  94. package/web/references/coinone/DESIGN.md +199 -179
  95. package/web/references/corca/DESIGN.md +414 -0
  96. package/web/references/coupang/DESIGN.md +205 -475
  97. package/web/references/cursor/DESIGN.md +240 -381
  98. package/web/references/dabang/DESIGN.md +248 -213
  99. package/web/references/dable/DESIGN.md +431 -0
  100. package/web/references/datarize/DESIGN.md +217 -330
  101. package/web/references/dealicious/DESIGN.md +402 -0
  102. package/web/references/drdiary/DESIGN.md +404 -0
  103. package/web/references/elastic/DESIGN.md +238 -0
  104. package/web/references/elevenlabs/DESIGN.md +183 -321
  105. package/web/references/eslite/DESIGN.md +257 -0
  106. package/web/references/evaair/DESIGN.md +338 -0
  107. package/web/references/expo/DESIGN.md +238 -331
  108. package/web/references/familymart-tw/DESIGN.md +254 -0
  109. package/web/references/ferrari/DESIGN.md +160 -377
  110. package/web/references/figma/DESIGN.md +197 -451
  111. package/web/references/fitpet/DESIGN.md +445 -0
  112. package/web/references/flex/DESIGN.md +170 -253
  113. package/web/references/framer/DESIGN.md +197 -340
  114. package/web/references/freee/DESIGN.md +211 -533
  115. package/web/references/friendliai/DESIGN.md +431 -0
  116. package/web/references/frip/DESIGN.md +440 -0
  117. package/web/references/gangnamunni/DESIGN.md +154 -591
  118. package/web/references/gaudiolab/DESIGN.md +414 -0
  119. package/web/references/google/DESIGN.md +290 -398
  120. package/web/references/hashicorp/DESIGN.md +273 -318
  121. package/web/references/heydealer/DESIGN.md +429 -0
  122. package/web/references/humanscape/DESIGN.md +433 -0
  123. package/web/references/hyundai/DESIGN.md +158 -368
  124. package/web/references/hyundaicard/DESIGN.md +171 -121
  125. package/web/references/ibm/DESIGN.md +227 -378
  126. package/web/references/idus/DESIGN.md +450 -0
  127. package/web/references/igaworks/DESIGN.md +437 -0
  128. package/web/references/inflearn/DESIGN.md +221 -366
  129. package/web/references/intuit/DESIGN.md +244 -0
  130. package/web/references/jandi/DESIGN.md +191 -291
  131. package/web/references/jobplanet/DESIGN.md +415 -0
  132. package/web/references/kakao/DESIGN.md +287 -475
  133. package/web/references/kakaobank/DESIGN.md +220 -521
  134. package/web/references/kakaogames/DESIGN.md +220 -0
  135. package/web/references/kakaopay/DESIGN.md +207 -526
  136. package/web/references/karrot/DESIGN.md +227 -251
  137. package/web/references/kb-kookmin/DESIGN.md +308 -0
  138. package/web/references/kbank/DESIGN.md +220 -175
  139. package/web/references/kmong/DESIGN.md +281 -356
  140. package/web/references/krds/DESIGN.md +245 -19
  141. package/web/references/kream/DESIGN.md +224 -359
  142. package/web/references/kurly/DESIGN.md +211 -533
  143. package/web/references/lamborghini/DESIGN.md +198 -360
  144. package/web/references/lguplus/DESIGN.md +259 -0
  145. package/web/references/likelion/DESIGN.md +283 -0
  146. package/web/references/line/DESIGN.md +396 -355
  147. package/web/references/linear.app/DESIGN.md +209 -562
  148. package/web/references/lotteon/DESIGN.md +386 -0
  149. package/web/references/lovable/DESIGN.md +255 -349
  150. package/web/references/makinarocks/DESIGN.md +149 -349
  151. package/web/references/maum-ai/DESIGN.md +423 -0
  152. package/web/references/medibloc/DESIGN.md +425 -0
  153. package/web/references/megabox/DESIGN.md +232 -0
  154. package/web/references/mercari/DESIGN.md +217 -434
  155. package/web/references/microsoft/DESIGN.md +234 -388
  156. package/web/references/mildang/DESIGN.md +411 -0
  157. package/web/references/millie/DESIGN.md +183 -504
  158. package/web/references/minimax/DESIGN.md +264 -322
  159. package/web/references/miricanvas/DESIGN.md +182 -355
  160. package/web/references/miro/DESIGN.md +234 -232
  161. package/web/references/mistral.ai/DESIGN.md +231 -314
  162. package/web/references/mixi/DESIGN.md +234 -0
  163. package/web/references/moin/DESIGN.md +445 -0
  164. package/web/references/mongodb/DESIGN.md +219 -316
  165. package/web/references/musinsa/DESIGN.md +184 -510
  166. package/web/references/mynavi/DESIGN.md +242 -0
  167. package/web/references/myrealtrip/DESIGN.md +169 -406
  168. package/web/references/naver/DESIGN.md +328 -499
  169. package/web/references/naverwebtoon/DESIGN.md +172 -395
  170. package/web/references/nhn/DESIGN.md +169 -346
  171. package/web/references/nhncloud/DESIGN.md +185 -123
  172. package/web/references/notion/DESIGN.md +271 -475
  173. package/web/references/nrise/DESIGN.md +417 -0
  174. package/web/references/ohouse/DESIGN.md +210 -549
  175. package/web/references/oliveyoung/DESIGN.md +217 -326
  176. package/web/references/ollama/DESIGN.md +241 -308
  177. package/web/references/onestore/DESIGN.md +248 -0
  178. package/web/references/palantir/DESIGN.md +256 -0
  179. package/web/references/panasonic/DESIGN.md +276 -0
  180. package/web/references/patternfly/DESIGN.md +259 -0
  181. package/web/references/payhere/DESIGN.md +438 -0
  182. package/web/references/pega/DESIGN.md +262 -0
  183. package/web/references/peoplefund/DESIGN.md +431 -0
  184. package/web/references/petfriends/DESIGN.md +428 -0
  185. package/web/references/pinkfong/DESIGN.md +199 -367
  186. package/web/references/pinterest/DESIGN.md +258 -308
  187. package/web/references/poya/DESIGN.md +286 -0
  188. package/web/references/pozalabs/DESIGN.md +438 -0
  189. package/web/references/protopie/DESIGN.md +419 -0
  190. package/web/references/qraft/DESIGN.md +448 -0
  191. package/web/references/quotabook/DESIGN.md +449 -0
  192. package/web/references/recruit/DESIGN.md +247 -0
  193. package/web/references/remember/DESIGN.md +202 -396
  194. package/web/references/resend/DESIGN.md +274 -348
  195. package/web/references/sakura-internet/DESIGN.md +269 -0
  196. package/web/references/samsung/DESIGN.md +157 -359
  197. package/web/references/sandoll/DESIGN.md +445 -0
  198. package/web/references/sanity/DESIGN.md +241 -375
  199. package/web/references/scatterlab/DESIGN.md +412 -0
  200. package/web/references/selectstar/DESIGN.md +439 -0
  201. package/web/references/servicenow/DESIGN.md +289 -0
  202. package/web/references/shinhanbank/DESIGN.md +161 -341
  203. package/web/references/shinhancard/DESIGN.md +208 -319
  204. package/web/references/sionic/DESIGN.md +454 -0
  205. package/web/references/sktelecom/DESIGN.md +310 -0
  206. package/web/references/socar/DESIGN.md +125 -32
  207. package/web/references/softbank/DESIGN.md +231 -0
  208. package/web/references/sony/DESIGN.md +234 -0
  209. package/web/references/soop/DESIGN.md +261 -0
  210. package/web/references/spacex/DESIGN.md +184 -323
  211. package/web/references/spotify/DESIGN.md +253 -394
  212. package/web/references/squeezebits/DESIGN.md +441 -0
  213. package/web/references/stayfolio/DESIGN.md +422 -0
  214. package/web/references/stripe/DESIGN.md +212 -491
  215. package/web/references/supabase/DESIGN.md +244 -316
  216. package/web/references/tabling/DESIGN.md +415 -0
  217. package/web/references/taishinbank/DESIGN.md +243 -0
  218. package/web/references/teamlab/DESIGN.md +240 -0
  219. package/web/references/teamsparta/DESIGN.md +472 -0
  220. package/web/references/tellingme/DESIGN.md +392 -0
  221. package/web/references/tesla/DESIGN.md +244 -427
  222. package/web/references/thsr/DESIGN.md +284 -0
  223. package/web/references/thumbtack/DESIGN.md +302 -0
  224. package/web/references/together.ai/DESIGN.md +257 -304
  225. package/web/references/toss/DESIGN.md +251 -593
  226. package/web/references/toss-securities/DESIGN.md +255 -178
  227. package/web/references/tossbank/DESIGN.md +195 -491
  228. package/web/references/toyota/DESIGN.md +238 -0
  229. package/web/references/tving/DESIGN.md +197 -245
  230. package/web/references/typed/DESIGN.md +413 -0
  231. package/web/references/uber/DESIGN.md +256 -333
  232. package/web/references/udn/DESIGN.md +250 -0
  233. package/web/references/upbit/DESIGN.md +145 -256
  234. package/web/references/upstage/DESIGN.md +211 -204
  235. package/web/references/uswds/DESIGN.md +287 -0
  236. package/web/references/vercel/DESIGN.md +236 -440
  237. package/web/references/wanted/DESIGN.md +215 -487
  238. package/web/references/wise/DESIGN.md +223 -231
  239. package/web/references/wisetracker/DESIGN.md +462 -0
  240. package/web/references/wooribank/DESIGN.md +245 -0
  241. package/web/references/yanolja/DESIGN.md +250 -419
  242. package/web/references/yeogiotte/DESIGN.md +235 -418
  243. package/web/references/zapier/DESIGN.md +256 -377
  244. package/web/references/zendesk/DESIGN.md +288 -0
  245. package/web/references/zigzag/DESIGN.md +200 -621
  246. package/dist/install-skills-7UUDOLG2.js +0 -734
  247. package/dist/install-skills-7UUDOLG2.js.map +0 -1
@@ -8,260 +8,295 @@ homepage: "https://www.dabangapp.com"
8
8
  primary_color: "#ff3478"
9
9
  logo:
10
10
  type: favicon
11
- slug: "https://www.google.com/s2/favicons?domain=dabangapp.com&sz=256"
12
- verified: "2026-05-15"
11
+ slug: "https://www.dabangapp.com/static/favicon.ico"
12
+ verified: "2026-07-13"
13
13
  omd: "0.1"
14
+ verification_v2:
15
+ schema: 2
16
+ checked: "2026-07-13"
17
+ surfaces:
18
+ - { id: product-home, kind: product-surface, url: "https://www.dabangapp.com/", inspected: "2026-07-13" }
19
+ - { id: product-map, kind: product-surface, url: "https://www.dabangapp.com/map/onetwo?m_lat=37.494367328004216&m_lng=127.01446798508894&m_zoom=11", inspected: "2026-07-13" }
20
+ - { id: support-faq, kind: support-documentation, url: "https://www.dabangapp.com/service/faq", inspected: "2026-07-13" }
21
+ sources:
22
+ - { id: home-capture, kind: product-surface, url: "https://www.dabangapp.com/", captured: "2026-07-13" }
23
+ - { id: map-capture, kind: product-surface, url: "https://www.dabangapp.com/map/onetwo?m_lat=37.494367328004216&m_lng=127.01446798508894&m_zoom=11", captured: "2026-07-13" }
24
+ - { id: faq-capture, kind: product-surface, url: "https://www.dabangapp.com/service/faq", captured: "2026-07-13" }
25
+ - { id: service-context, kind: official-doc, url: "https://www.station3.co.kr/service/", captured: "2026-07-13" }
26
+ - { id: terms-context, kind: official-doc, url: "https://static.dabangapp.com/html/useragreement.html", captured: "2026-07-13" }
27
+ - { id: font-design, kind: brand-asset, url: "https://github.com/orioncactus/pretendard", captured: "2026-07-13" }
28
+ - { id: font-license, kind: license, url: "https://github.com/orioncactus/pretendard/blob/main/LICENSE", captured: "2026-07-13" }
29
+ conflicts: []
30
+ claims:
31
+ "tokens.colors.canvas": &home { surface_id: product-home, source_id: home-capture, method: computed-style, captured: "2026-07-13" }
32
+ "tokens.colors.foreground": *home
33
+ "tokens.colors.border": *home
34
+ "tokens.colors.surface-muted": *home
35
+ "tokens.colors.action": &map { surface_id: product-map, source_id: map-capture, method: computed-style, captured: "2026-07-13" }
36
+ "tokens.colors.map-field-border": *map
37
+ "tokens.typography.family.ui": *home
38
+ "tokens.typography.body.size": *home
39
+ "tokens.typography.body.weight": *home
40
+ "tokens.typography.body.lineHeight": *home
41
+ "tokens.typography.body.use": *home
42
+ "tokens.typography.section-title.size": *home
43
+ "tokens.typography.section-title.weight": *home
44
+ "tokens.typography.section-title.lineHeight": *home
45
+ "tokens.typography.section-title.use": *home
46
+ "tokens.typography.map-control.size": *map
47
+ "tokens.typography.map-control.weight": *map
48
+ "tokens.typography.map-control.lineHeight": *map
49
+ "tokens.typography.map-control.use": *map
50
+ "tokens.spacing.xs": *home
51
+ "tokens.spacing.sm": *home
52
+ "tokens.spacing.md": *home
53
+ "tokens.rounded.compact": *home
54
+ "tokens.rounded.standard": *home
55
+ "tokens.rounded.map-tool": *map
56
+ "tokens.rounded.search-entry": *home
57
+ "tokens.rounded.map-search": *map
58
+ "tokens.components.header-account-control.type": *home
59
+ "tokens.components.header-account-control.bg": *home
60
+ "tokens.components.header-account-control.fg": *home
61
+ "tokens.components.header-account-control.radius": *home
62
+ "tokens.components.header-account-control.padding": *home
63
+ "tokens.components.header-account-control.font": *home
64
+ "tokens.components.header-account-control.states": *home
65
+ "tokens.components.header-account-control.use": *home
66
+ "tokens.components.header-outline-action.type": *home
67
+ "tokens.components.header-outline-action.fg": *home
68
+ "tokens.components.header-outline-action.border": *home
69
+ "tokens.components.header-outline-action.radius": *home
70
+ "tokens.components.header-outline-action.padding": *home
71
+ "tokens.components.header-outline-action.font": *home
72
+ "tokens.components.header-outline-action.states": *home
73
+ "tokens.components.header-outline-action.use": *home
74
+ "tokens.components.map-location-search.type": *map
75
+ "tokens.components.map-location-search.bg": *map
76
+ "tokens.components.map-location-search.fg": *map
77
+ "tokens.components.map-location-search.border": *map
78
+ "tokens.components.map-location-search.radius": *map
79
+ "tokens.components.map-location-search.padding": *map
80
+ "tokens.components.map-location-search.font": *map
81
+ "tokens.components.map-location-search.states": *map
82
+ "tokens.components.map-location-search.use": *map
83
+ "tokens.components.map-dock-control.type": *map
84
+ "tokens.components.map-dock-control.bg": *map
85
+ "tokens.components.map-dock-control.fg": *map
86
+ "tokens.components.map-dock-control.border": *map
87
+ "tokens.components.map-dock-control.radius": *map
88
+ "tokens.components.map-dock-control.padding": *map
89
+ "tokens.components.map-dock-control.font": *map
90
+ "tokens.components.map-dock-control.states": *map
91
+ "tokens.components.map-dock-control.use": *map
14
92
  tokens:
15
- source: prose-derived
16
- extracted: "2026-06-09"
17
- note: "brand pink #FF3478 stays wordmark-only; functional accent is action blue #326CF9. Strict 3-layer color discipline: pink=brand, blue=action, gray=content."
93
+ source: reconciled
94
+ extracted: "2026-07-13"
95
+ note: "Values are limited to selector-backed home and map observations in the supplied evidence. The support FAQ is documentation chrome, not a product-token source."
18
96
  colors:
19
- primary: "#326CF9"
20
- primary-hover: "#326CF9"
21
- brand: "#FF3478"
22
- canvas: "#FFFFFF"
23
- surface: "#FFFFFF"
97
+ canvas: "#ffffff"
24
98
  foreground: "#222222"
25
- body: "#222222"
26
- muted: "#656565"
27
- on-primary: "#FFFFFF"
28
- hairline: "#DFDFDF"
29
- surface-muted: "#F5F5F5"
30
- hover-tint: "#EEF8FF"
31
- success: "#1CA885"
32
- danger: "#E20724"
33
- warning: "#FFB600"
34
- premium: "#3E26FD"
99
+ border: "#dfdfdf"
100
+ surface-muted: "#f5f5f5"
101
+ action: "#326cf9"
102
+ map-field-border: "#ededed"
35
103
  typography:
36
- family: { sans: "Pretendard Variable" }
37
- section: { size: 20, weight: 700, lineHeight: 1.3, use: "Category section heads position + weight, not size" }
38
- ai-band: { size: 24, weight: 400, lineHeight: 1.3, use: "AI band head — largest yet lightest, editorial signal" }
39
- body: { size: 16, weight: 400, lineHeight: 1.5, use: "Body default, #222222" }
40
- chip: { size: 14, weight: 500, lineHeight: 1.4, use: "Filter-chip label (only 500-weight role)" }
41
- caption: { size: 13, weight: 400, lineHeight: 1.4, use: "Secondary text / meta" }
42
- spacing: { xs: 4, sm: 8, md: 16, base: 8, lg: 24, xl: 32, xxl: 48, section: 64 }
43
- rounded: { sm: 2, md: 4, lg: 8, xl: 12, entry: 32, filter: 42, full: 9999 }
44
- shadow:
45
- none: "none — zero box-shadow across surface; depth via 1px borders + bg-color steps"
46
- components_harvested: true
104
+ family: { ui: "Pretendard Variable" }
105
+ body: { size: 14, weight: 400, lineHeight: "24px", use: "Repeated public home and map text/control cluster" }
106
+ section-title: { size: 20, weight: 700, lineHeight: "32px", use: "Public-home section-title sample" }
107
+ map-control: { size: 14, weight: 400, lineHeight: "24px", use: "Map location-search and dock-control samples" }
108
+ spacing: { xs: 4, sm: 8, md: 16 }
109
+ rounded: { compact: 2, standard: 8, map-tool: 6, search-entry: 32, map-search: 42 }
47
110
  components:
48
- button-entry: { type: button, fg: "#222222", radius: 32, use: "Home search-entry pill tap to start a search" }
49
- filter-chip: { type: toggle, bg: "#FFFFFF", fg: "#222222", radius: 42, font: "14/500", use: "Map filter pill, 1px #DFDFDF border; active = #326CF9 border + #EEF8FF bg" }
50
- listing-card: { type: card, bg: "#FFFFFF", radius: 8, use: "Floating left-rail listing card, 1px #DFDFDF border, no shadow" }
51
- map-marker: { type: badge, bg: "#FFFFFF", fg: "#222222", radius: 2, use: "Price-bearing pill marker; selected = #326CF9 fill price is the marker" }
52
- icon-control: { type: button, radius: 9999, use: "Circular bookmark / close control" }
111
+ header-account-control: { type: button, bg: "#ffffff", fg: "#222222", radius: "8px", padding: "8px 16px", font: "16px / 400 Pretendard Variable", states: "default only; no interaction expansion captured", use: "Shared public header account control; home::[data-omd-capture=4]" }
112
+ header-outline-action: { type: button, fg: "#222222", border: "1px solid #dfdfdf", radius: "2px", padding: "0px 16px", font: "14px / 700 Pretendard Variable", states: "default only; no interaction expansion captured", use: "Shared public header outline action; home::[data-omd-capture=5]" }
113
+ map-location-search: { type: input, bg: "#ffffff", fg: "#222222", border: "1px solid #ededed", radius: "42px", padding: "7px 37px 7px 15px", font: "14px / 400 Pretendard Variable", states: "default only; no interaction expansion captured", use: "Map location-search field; surface-2::[data-omd-capture=1]" }
114
+ map-dock-control: { type: button, bg: "#ffffff", fg: "#000000", border: "1px solid #dfdfdf", radius: "2px", padding: "0px 7px 0px 11px", font: "14px / 400 Pretendard Variable", states: "default only; no interaction expansion captured", use: "Map dock control; surface-2::[data-omd-capture=14]" }
115
+ components_harvested: true
53
116
  ---
54
117
 
55
118
  # Design System Inspiration of Dabang (다방)
56
119
 
57
120
  ## 1. Visual Theme & Atmosphere
58
121
 
59
- Dabang's web product reads like a working tool that does not want to be looked at too long. The home surface is white, the map surface is whiter, and the chrome between them is a near-black `#222` neutral sitting at body weight 400 on top of Pretendard Variable. Where its direct competitor Zigbang reaches for a Bloomberg-terminal restraint and reserves orange exclusively for the wordmark, Dabang takes the opposite trade: a saturated brand pink — `#FF3478`, internally tokenised as `--pink-500` sits on the logo and stays there. Action moves to a different color entirely. The functional accent is blue `#326CF9` (`--blue-500`), and it appears in two places only: the selected map marker, and the focus state on filter pills. That split — pink for identity, blue for behavior, near-black for everything else is the structural decision that organizes the system.
122
+ Dabang is Station3’s residential-information service: the company presents Dabang alongside its broker and landlord services, while the service terms describe a platform where individual users, licensed brokers, and landlords can find or register property information. The current public web product is deliberately utilitarian rather than a brand campaign. Its home and map routes use a white field, dark neutral text, compact controls, and one loaded `Pretendard Variable` family to make browsing and filtering legible. The notable product expression is geometric rather than decorative: an 8px header control, 2px outlined actions, a 32px home-search pill, and a 42px map-search pill coexist because they serve different contexts.
60
123
 
61
- The map page is where the design's intent becomes visible. Filter chips sit on a 1px `#DFDFDF` border at a 42px pill radius, weight 500 text — full-round pills, not the 8/10px rectangles the rest of the Korean property cohort ships. The map canvas itself fills the viewport; price markers float over it as small rounded rectangles tinted by `--blue-500` when selected and a deep gray when default. There is no box-shadow anywhere on the production surface 53 of 53 sampled elements returned `box-shadow: none`. Depth is borders and tints exclusively: a 1px hairline in `#DFDFDF` for separation, a `#EEF8FF` (the lightest blue-50) wash for hover, a `#F5F5F5` plate for muted sections. The product is engineered to be skimmed at speed; it does not perform visual weight.
124
+ The supplied evidence establishes three separate source domains: the home and map as product surfaces, the FAQ as support-documentation chrome, and Station3’s service page as corporate context. This reference does not turn support controls or corporate messaging into universal product tokens.
62
125
 
63
- The token system is unusually complete for a Korean consumer property app. Captured directly off `:root` via CDP, Dabang exposes a full 8-hue × 10-step scale — blue, pink, gray, green, violet, yellow, red, plus an `-rgb` variant of each step (140 CSS custom properties total). The ramps are not decorative; they encode product reality. `--pink-500` is the brand wordmark. `--blue-500` is interaction. `--gray-900` (`#222`) is body text. `--green-500` (`#1ca885`) is reserved for verified-listing and "안심" trust signals (not observed live this pass, inferred from token semantics). The colored ramps not seen on the home or map surfaces (violet, yellow, red beyond 500) sit on `:root` waiting — Dabang built the system, then deployed only the slice it needed.
126
+ ## 2. Color Palette & Roles
64
127
 
65
- The most striking single decision is the AI feature band. Where every other H1 on the home page is `font-weight: 700` (원/투룸, 아파트, 주택/빌라, 오피스텔, 분양 all 18-20px, all bold), the AI personalized band reads "관심있는 [동] 주변, AI가 대신 찾아봤어요 🔍" at 24px / **400**. It is the largest heading on the page and the lightest. The choice signals an intentional voice: AI is conversational, AI does not shout, AI is the only place on the surface where an emoji is allowed. It is the one place the system relaxes — and it does so by going *lighter*, not bolder.
128
+ - `#FFFFFF` — observed public home/map canvas and control background.
129
+ - `#222222` — repeated home/map foreground and control text.
130
+ - `#DFDFDF` — repeated outline border on public header and map dock controls.
131
+ - `#F5F5F5` — observed muted surface and header-control hover sample; it is not promoted as a global interaction state.
132
+ - `#EDEDED` — map location-search border.
133
+ - `#326CF9` — observed map-route action ink/border and selected tool treatment. The current evidence supports it as a map action color, not a universal Dabang CTA rule.
134
+
135
+ The pink value in frontmatter is catalog identity metadata. It was not established as a reusable current product-control token by this supplied capture, so it is not silently substituted for the map action color.
136
+
137
+ ## 3. Typography Rules
138
+
139
+ ### Verified visible UI family
140
+
141
+ `Pretendard Variable` is the only family promoted to `tokens.typography.family.ui`. The supplied bundle records 376 visible first-family uses across body text, headings, buttons, inputs, and lists; it is marked `loaded` with high confidence and is corroborated by 92 Dabang-hosted dynamic-subset WOFF2 source URLs. That is computed use plus FontFaceSet/source corroboration, not an inference from a CSS declaration.
142
+
143
+ | Role | Observed value | Surface boundary |
144
+ |---|---|---|
145
+ | Body/control cluster | 14px / 400 / 24px | Repeated on the public home and map routes |
146
+ | Home section title | 20px / 700 / 32px | Public home heading sample |
147
+ | Map input/dock control | 14px / 400 / 24px | Map search and dock-control samples |
148
+ | Support FAQ display | 46px / 700 / 70px | Support-documentation route only; not a product type token |
149
+
150
+ | Evidence class | Resolution |
151
+ |---|---|
152
+ | **Official product-use** | No separate Dabang typography announcement was found in the checked official sources. |
153
+ | **Live computed surface-use** | `Pretendard Variable` is loaded/high and visibly used across all three supplied routes. |
154
+ | **Official distributed asset** | Pretendard’s upstream project distributes the family under SIL Open Font License 1.1. This explains the font asset but does not itself prove Dabang use. |
155
+ | **Declared-only** | No additional family is promoted from declarations because the supplied bundle reports only the loaded, visible Pretendard family. |
156
+ | **Unresolved** | Native-app typography metrics and a Dabang-owned font licence/asset are not established by these public web sources. |
157
+
158
+ ## 4. Components
159
+
160
+ ### Header account control
161
+
162
+ **Default**
163
+ - Background: `#FFFFFF`
164
+ - Text: `#222222`
165
+ - Radius: `8px`
166
+ - Padding: `8px 16px`
167
+ - Font: `16px / 400 Pretendard Variable`
168
+ - Use: Shared public header account control on the product home; `home::[data-omd-capture="4"]`.
169
+
170
+ ### Header outline action
171
+
172
+ **Default**
173
+ - Text: `#222222`
174
+ - Border: `1px solid #DFDFDF`
175
+ - Radius: `2px`
176
+ - Padding: `0px 16px`
177
+ - Font: `14px / 700 Pretendard Variable`
178
+ - Use: Shared public header outline action; `home::[data-omd-capture="5"]`.
179
+
180
+ ### Map location search
181
+
182
+ **Default**
183
+ - Background: `#FFFFFF`
184
+ - Text: `#222222`
185
+ - Border: `1px solid #EDEDED`
186
+ - Radius: `42px`
187
+ - Padding: `7px 37px 7px 15px`
188
+ - Font: `14px / 400 Pretendard Variable`
189
+ - Use: Map location-search field; `surface-2::[data-omd-capture="1"]`.
190
+
191
+ ### Map dock control
192
+
193
+ **Default**
194
+ - Background: `#FFFFFF`
195
+ - Text: `#000000`
196
+ - Border: `1px solid #DFDFDF`
197
+ - Radius: `2px`
198
+ - Padding: `0px 7px 0px 11px`
199
+ - Font: `14px / 400 Pretendard Variable`
200
+ - Use: Map dock control; `surface-2::[data-omd-capture="14"]`.
201
+
202
+ ### Support FAQ row
203
+
204
+ **Default**
205
+ - Text: `#000000`
206
+ - Border: `1px solid #F5F5F5` on the block end
207
+ - Padding: `16px 20px`
208
+ - Font: `13.3333px / 400 Pretendard Variable`
209
+ - Use: Support-documentation FAQ row; `surface-3::[data-omd-capture="10"]`. It is documented here as support chrome, not promoted into product tokens.
210
+
211
+ The supplied bundle has `interactionCount: 0` and an empty `interactions` array. Static selector strings ending in hover, focus, or pressed are therefore not reusable state evidence. No menu, dialog, validation, disabled, loading, responsive, or component variants beyond the defaults above are claimed.
66
212
 
67
- **Key Characteristics:**
68
- - **Pretendard Variable** universal (100% — 53/53 samples)
69
- - **Pink-500 `#FF3478`** brand-mark only — never appears on functional UI on the map surface
70
- - **Blue-500 `#326CF9`** as the single functional accent — selected marker, focus ring, link emphasis
71
- - **Near-black `#222` (`--gray-900`)** as the dominant text token — 21/53 samples
72
- - **42px full-pill filter chips** with 1px `#DFDFDF` border — distinctive vs Zigbang's 10px chip default
73
- - **Zero box-shadow** across the production surface — depth is borders + tints exclusively
74
- - **Two pill radii co-exist**: 32px for entry CTAs (home search), 42px for filter strips (map) — a *contextual* radius ladder, not a flat scale
75
- - **Weight cliff 400 → 700** with only 2 occurrences of 500 across 53 samples — emphasis is binary
76
- - **AI band at 24px / 400** — the lightest large heading is the editorial signal of the AI surface
213
+ ---
77
214
 
78
- ## 2. Color Palette & Roles
215
+ **Verified:** 2026-07-13
216
+ **Tier 1 sources:** `https://www.dabangapp.com/` (product home), `https://www.dabangapp.com/map/onetwo?m_lat=37.494367328004216&m_lng=127.01446798508894&m_zoom=11` (product map), `https://www.dabangapp.com/service/faq` (support documentation), `https://www.station3.co.kr/service/` (official company/service context), `https://static.dabangapp.com/html/useragreement.html` (official service and stakeholder context), `https://github.com/orioncactus/pretendard` (upstream font context), and `https://github.com/orioncactus/pretendard/blob/main/LICENSE` (font licence).
217
+ **Tier 2 sources:** `https://getdesign.md/dabang` (attempted; built-in web open safe-open failure and name search returned no record), `https://styles.refero.design/?q=dabang` (attempted; built-in web open safe-open failure and name search returned no record).
218
+ **Conflicts unresolved:** none
79
219
 
80
- ### Brand
81
- - **Dabang Pink** `#FF3478` (`--pink-500`): logo wordmark and brand-chrome accent. Used 2× in 32 home samples; **does not propagate** into the map product surface. This is the system's most disciplined rule — brand color stays in the brand layer.
82
- - **Map Canvas White** `#FFFFFF`: the dominant surface on `/map/onetwo`. Listing cards, filter pills, and chrome float above the map tiles with hairline borders separating them.
220
+ The earlier reference’s full semantic colour ramps, pink-as-global-brand-control rule, status meanings, map-marker semantics, universal 8px layout system, zero-shadow universal rule, and unobserved interaction/motion matrices were rolled back. The supplied 2026 bundle does not substantiate them as reusable product claims.
83
221
 
84
- ### Text Neutrals (full gray ramp on `:root`)
85
- - `--gray-50` `#FCFCFC` · `--gray-100` `#FAFAFA` · `--gray-200` `#F5F5F5` · `--gray-300` `#EDEDED` · `--gray-400` `#DFDFDF` · `--gray-500` `#CCCCCC` · `--gray-600` `#979797` · `--gray-700` `#656565` · `--gray-800` `#434343` · `--gray-900` `#222222`
86
- - **Primary body text** = `--gray-900` `#222` (observed 21/53)
87
- - **Secondary text** = `--gray-700` `#656565` (2/53, footer / meta)
88
- - **Default border** = `--gray-400` `#DFDFDF` (7/21 map samples — single most-used border value)
222
+ ## 5. Layout Principles
89
223
 
90
- ### Interactive
91
- - **Action Blue** `#326CF9` (`--blue-500`): selected marker fill, focus ring, primary link emphasis. The full blue ramp (50→900) is on `:root` for state escalation.
92
- - **Hover/active tint** `#EEF8FF` (`--blue-50`): the only tint observed live for hover/active surfaces.
224
+ - The home and map are distinct product compositions: home exposes a 32px-radius search-entry control, while the map route uses a 42px location-search field and compact dock controls.
225
+ - Repeated observed spacing values support only a conservative `4 / 8 / 16px` set. They do not establish a full layout grid, rail width, map-canvas percentage, or breakpoint contract.
226
+ - The FAQ uses a separate support-documentation layout. Its 16px/20px row padding must not be treated as map or listing-card spacing.
93
227
 
94
- ### Trust / Status (system-ready, not all observed live)
95
- - `--green-500` `#1CA885` inferred role: verified-listing / 안심 badge (semantic match to KR property convention).
96
- - `--red-500` `#E20724` inferred role: error / urgent / sold-out indicator.
97
- - `--yellow-500` `#FFB600` inferred role: warning / pending state.
98
- - `--violet-500` `#3E26FD` inferred role: premium / promoted-listing tier (the violet ramp is the cleanest mathematical ladder in the system — suggests reserved future-feature use).
228
+ ## 6. Depth & Elevation
99
229
 
100
- ### Surface
101
- - **Page bg** `#FFFFFF` (17/53)
102
- - **Muted plate** `#F5F5F5` (`--gray-200`)
103
- - **Hover tint** `#EEF8FF` (`--blue-50`)
104
- - **Deep slate promo panel** `rgb(67, 77, 104)` — used once for a saved-search call-out band; off-ladder color, suggesting marketing-team override rather than token-system primitive.
230
+ The selector-backed product controls retained in §4 report `box-shadow: none`. This is useful evidence for those controls, but not proof of a global zero-elevation system: the supplied routes do not establish cards, markers, drawers, or native-app elevation. Use flat borders and surfaces only where a retained component names them; label any broader shadow system as a local extension.
105
231
 
106
- ### Color discipline summary
107
- The system separates three layers with strict color rules:
108
- 1. **Brand layer** (logo / wordmark) — `--pink-500` only.
109
- 2. **Action layer** (selected / focus / link) — `--blue-500` only.
110
- 3. **Content layer** (text / borders / surfaces) — gray ramp only.
232
+ ## 7. Do's and Don'ts
111
233
 
112
- The other five hues (green, violet, yellow, red, beyond the 500 steps of blue/pink) are present on `:root` but not deployed on home or map chrome. They exist for status and state escalation, not decoration.
234
+ ### Do
113
235
 
114
- ## 3. Typography
236
+ - Keep home, map, support-documentation, and corporate-context evidence explicitly separated.
237
+ - Use `Pretendard Variable` only where its loaded public-web evidence applies; retain a normal runtime fallback in an implementation.
238
+ - Preserve the observed 32px home-search and 42px map-search geometries as separate controls.
239
+ - Use `#326CF9` only for the documented map action context unless a broader product source verifies it.
240
+ - Build the retained outline controls from their explicit border, radius, padding, and type values.
115
241
 
116
- - **Family**: Pretendard Variable (100% of 53 samples). No display accent, no second family. Fallback chain inferred: Pretendard Variable → Pretendard JP Variable → -apple-system → BlinkMacSystemFont → system-ui → Apple SD Gothic Neo → Noto Sans KR → Malgun Gothic → sans-serif.
117
- - **Weights**: 400 (39/53), 700 (12/53), 500 (2/53). The system effectively ships a **binary weight rhythm** with 500 reserved for filter-chip labels on the map surface.
118
- - **Sizes observed**: 10 · 12 · 13 · 14 · 16 · 18 · 20 · 24 px. No 32 / 40 / 48 captured on the surfaces sampled — Dabang does not have a marketing hero typeface scale visible from product entry.
119
- - **Body default**: 16px / 400 / `--gray-900`.
120
- - **Section heads (categories)**: 18-20px / 700.
121
- - **AI band head**: 24px / 400 — the deliberate inversion (largest = lightest).
122
- - **Hierarchy logic**: position + weight, not size. The system trusts that "section title" reads as such because it sits at the top of a card grid, not because it is 40px.
242
+ ### Don't
123
243
 
124
- ## 4. Spacing & Layout
244
+ - Don't promote the frontmatter pink identity color into a current universal CTA or status color.
245
+ - Don't represent the FAQ disclosure row as a product-listing, modal, or accordion component contract.
246
+ - Don't infer hover, pressed, focus, disabled, error, or loading states from static pseudo-state selector names when interaction expansion is zero.
247
+ - Don't substitute a system font as if it were loaded Pretendard Variable.
248
+ - Don't invent map markers, card elevation, breakpoints, icon geometry, or motion values absent from the supplied evidence.
125
249
 
126
- - **Base grid**: 8px (inferred from padding samples; not exhaustively token-mined this pass — flagged for UPDATE).
127
- - **Map canvas dominance**: ~70% of viewport width on `/map/onetwo` belongs to the map tile renderer; chrome (left listing rail, top filter strip) is built around not obscuring it.
128
- - **Listing rail**: floating left column, card-based, 1px `--gray-400` borders, no shadow.
129
- - **Filter strip**: horizontal pill row across the top of the map surface, 42px pill radius, 1px hairline border.
130
- - **Home page**: vertical card grid with section bands; AI band uses a different background tint to signal its different voice.
250
+ ## 8. Responsive Behavior
131
251
 
132
- ## 5. Radius
252
+ The supplied evidence uses a 1440×900 viewport for all three routes. It does not verify mobile breakpoints, map drawer behavior, native safe areas, or listing density at another viewport. Treat the current dimensions as desktop public-web observations only.
133
253
 
134
- A **contextual ladder**, not a flat scale:
135
- - `0px` (31/53) — default for text containers, dividers, list items
136
- - `2px` (7/53) — tight chips, map markers
137
- - `4px` (3/53) — input fields
138
- - `8px` (5/53) — cards, secondary buttons
139
- - `12px` (2/53) — large card surfaces, promo panel
140
- - `32px` (1/53) — home search-entry pill
141
- - `42px` (1/53) — map filter chips
142
- - `50%` (2/53) — circular icon controls (bookmark, close)
254
+ ## 9. Agent Prompt Guide
143
255
 
144
- The two pill radii (32 and 42) co-exist because they signal different things: 32px is "tap to start a search," 42px is "filter you can toggle on/off mid-flow." The distinction is functional, not aesthetic.
256
+ - “Create a Dabang public-home account control with a white background, `#222222` text, 8px radius, 8px 16px padding, and 16px/400 Pretendard Variable.”
257
+ - “Create a Dabang map location-search field with a white background, 1px `#EDEDED` border, 42px radius, 7px 37px 7px 15px padding, and 14px/400 Pretendard Variable.”
258
+ - “Create a map dock control from the selector-backed default only; do not add hover, disabled, or selected states as verified Dabang behaviour.”
259
+ - “If a component is not listed here, mark it as an extension rather than presenting it as a verified Dabang product component.”
145
260
 
146
- ## 6. Elevation
261
+ ## 10. Voice & Tone
147
262
 
148
- **Zero box-shadow** across 53 sampled production elements (100%). Depth is achieved exclusively by:
149
- 1. 1px `--gray-400` borders
150
- 2. Background-color steps (white → `--gray-200` → `--blue-50` tint)
151
- 3. Z-stacking via position (filter strip > map; listing rail > map)
263
+ The official service context centres on housing information and on connecting the people who search for, list, and manage a property: individual users, licensed brokers, and landlords. That makes the reliable voice direction practical and role-aware. Name the property task, make the next action clear, and distinguish information provided by the platform from content entered by a user or broker. Avoid a campaign-like promise, a demographic stereotype, or an implication that the platform itself is a party to a property transaction.
152
264
 
153
- This matches Bunjang's zero-shadow discipline and diverges from Zigbang (minor floating shadows on drawer) and most international property platforms (Zillow / Rightmove ship multi-tier shadow scales). The structural argument: shadows on a map surface fight the map's own visual depth (terrain tints, road shadows). Borders do not.
265
+ ## 11. Brand Narrative
154
266
 
155
- ## 7. Motion & State
267
+ Station3 publicly positions Dabang beside Dabang Pro and Dabang Bangjoo-in: consumer property discovery, broker workflow, and landlord-management services are related but different offerings. The service terms make the platform boundary equally explicit: Dabang provides real-estate information and a place for registered content, while users, landlords, and brokers provide the relevant listings and conduct their own transactions.
156
268
 
157
- - Motion tokens **not captured** this pass (single static CDP capture; no animation timeline observed).
158
- - Filter chip state inferred (active → `--blue-500` border + `--blue-50` background; default → `--gray-400` border + white).
159
- - Hover state observed once as the `--blue-50` `#EEF8FF` background tint.
160
- - **Flagged for UPDATE**: full state matrix (hover / active / disabled / loading) and motion duration/easing tokens.
269
+ The current public web UI reflects that operational role. Its controlled neutral palette and compact map controls prioritize a finding/filtering task rather than a decorative real-estate lifestyle story. The pink identity colour remains catalog metadata in this revision because the supplied web evidence does not show it as a reusable product-control rule.
161
270
 
162
- ## 8. Iconography & Imagery
271
+ ## 12. Principles
163
272
 
164
- - **Map markers**: pill-shaped price-bearing markers text content (e.g. "전세 3.2억") replaces the typical icon-only pin. This is the system's defining product affordance: price *is* the marker.
165
- - **Category icons**: light-line illustrative icons on the home category grid (원/투룸 · 아파트 · 주택/빌라 · 오피스텔 · 분양).
166
- - **AI band emoji**: 🔍 the only emoji captured live on the home surface. Emoji presence is a voice signal, not a decorative pattern.
167
- - **Listing photography**: thumbnails likely portrait-oriented for mobile-first display (Bunjang uses 81:100; Dabang's exact aspect ratio not captured this pass — flagged).
273
+ 1. **Separate source domains.** Home/map evidence, FAQ chrome, and Station3 corporate copy have different authority.
274
+ *UI implication:* do not merge their component values into one synthetic library.
275
+ 2. **Keep property tasks explicit.** The terms distinguish search, listing, and transaction roles.
276
+ *UI implication:* name the task and actor instead of using vague conversion language.
277
+ 3. **Use action blue locally.** `#326CF9` is verified in the map-route action treatment only.
278
+ *UI implication:* expand its use only after a specific product component provides evidence.
279
+ 4. **Preserve measured geometry.** The two search pills differ by route and purpose.
280
+ *UI implication:* keep the 32px and 42px radii distinct rather than averaging them.
168
281
 
169
- ## 9. Accessibility & A11y Notes
282
+ ## 13. Personas
170
283
 
171
- - Pretendard Variable + 16px body sits well above WCAG SC 1.4.4 floor.
172
- - `#222` text on `#FFF` background = 16.0:1 (passes AAA).
173
- - `#326CF9` action blue on white = 4.6:1 (passes AA for normal text).
174
- - **`#FF3478` brand pink on white = 3.4:1 — fails AA for body text**, passes AA only for large text ≥18.66px. Dabang appears to honor this by restricting pink to the wordmark and large-display contexts, not running body text in brand color. Downstream port should preserve this restriction.
175
- - **42px filter pills** comfortably exceed WCAG 2.5.5 minimum hit target (44px tap target measured center-to-edge of pill).
176
- - Map markers at 2px radius are visually crisp but may have hit-target debt at default zoom — flagged for verification.
284
+ These are service-role contexts from the official terms and Station3 service page, not invented demographic personas.
177
285
 
178
- ## 10. Voice & Tone
286
+ - **Property seeker:** searches public housing information and needs a clear route into filtering or inquiry.
287
+ - **Licensed broker:** can register and provide permitted property information through the service.
288
+ - **Landlord:** can provide a listing for rental and needs the platform’s registration boundary made clear.
179
289
 
180
- Dabang's voice on the home surface is **functional with one moment of warmth**. Category labels are bare nouns (원/투룸 · 아파트 · 분양). Section heads are imperative-light ("우리동네 한눈에 보기" — "see your neighborhood at a glance"). Then the AI band drops the bold and adds an emoji: "관심있는 [동] 주변, AI가 대신 찾아봤어요 🔍" — "AI looked around your neighborhood for you 🔍". The verb-ending `-했어요` is casual-polite (반말 톤은 아니지만 격식체도 아닌 중간 톤). The rest of the page is `-합니다` or noun-only labels. The voice cliff is intentional: AI talks, the rest of the product labels.
181
-
182
- **OmD-original voice reconstructions** (illustrative, tone-shape-only, not adopted from Dabang surface):
183
- - "내가 살고 싶은 동네, 다 찾아봤어요" (warmth — match AI band register)
184
- - "원룸 137건. 지도에서 확인하세요" (functional — match category label register)
185
- - "조건 저장하면 새 매물 알려드려요" (utility — match notification register)
186
-
187
- The system rule: warmth lives in the AI surface; functionality lives in the chrome. Do not bleed casual `-요` endings into structural labels.
188
-
189
- ## 11. Personas (factual inferred — public-survey-only)
190
-
191
- [FILL IN — Dabang user surveys/research not publicly indexed at OmD attribution fidelity.] Reported product positioning suggests:
192
- 1. **20s-30s renter searching one-room / two-room (원/투룸)** — primary surface user; price-marker-first browsing
193
- 2. **Newlyweds / first-home buyers searching apartment listings (아파트)** — secondary segment; broader filter use
194
- 3. **Pre-construction subscribers tracking new-build offerings (분양)** — niche but visible nav slot
195
-
196
- §11 narrative is treated as **factual inference from public surface positioning**, not as adopted persona research. Any downstream use should re-validate with primary research.
197
-
198
- ## 12. Anti-Patterns (don't steal)
199
-
200
- - **Do not stretch `--pink-500` into product chrome.** Dabang's discipline is to keep pink as wordmark-only; copying the color without the discipline produces a "saturated red-pink" experience that fights the map.
201
- - **Do not adopt the zero-shadow rule without the border discipline.** Removing shadow but not investing in clean 1px hairlines collapses depth entirely; borders are doing the work shadows would.
202
- - **Do not flatten the contextual radius ladder.** 32 and 42 px are *different decisions*; replacing both with "16px pill" loses the affordance distinction (entry-CTA vs toggle-filter).
203
- - **Do not propagate the 400-weight AI band tone elsewhere.** It works because the rest of the surface is 700-bold; making everything 400 collapses the voice cliff.
204
- - **Do not adopt the 14px Korean body density** without verifying line-height and letter-spacing on the target language. Dabang's 14-16px stack is tuned for Korean character rendering on Pretendard.
205
-
206
- ## 13. Tokens-as-Shipped Summary
207
-
208
- ```
209
- --pink-500 #FF3478 brand wordmark
210
- --blue-500 #326CF9 action / selected
211
- --gray-900 #222222 primary text
212
- --gray-700 #656565 secondary text
213
- --gray-400 #DFDFDF default border
214
- --gray-200 #F5F5F5 muted plate
215
- --blue-50 #EEF8FF hover tint
216
- --green-500 #1CA885 trust / verified (inferred role)
217
- --red-500 #E20724 error / urgent (inferred role)
218
- --yellow-500 #FFB600 warning (inferred role)
219
- --violet-500 #3E26FD premium / promoted (inferred role)
220
-
221
- radius: 0 / 2 / 4 / 8 / 12 / 32 / 42 / 50%
222
- weight: 400 / 500(sparse) / 700
223
- font: Pretendard Variable (100%)
224
- shadow: none (100%)
225
- ```
226
-
227
- ## 14. Methodology & Sources
228
-
229
- - **Tier 1 — live product** (positive): Chrome DevTools Protocol :9222, `Runtime.evaluate` + `getComputedStyle` on `https://www.dabangapp.com/` (32 samples) and `https://www.dabangapp.com/map/onetwo` (21 samples) on 2026-05-15. 140 CSS custom properties extracted from `:root`. Full proof in `assets/_reference/.live-inspect-proof.json`.
230
- - **Tier 1 — official DS** (negative, authoritative): `design.dabangapp.com` / `brand.dabangapp.com` / `tech.dabangapp.com` / `docs.dabangapp.com` all DNS no-resolve. `dabangapp.com/brand` and `/design` return HTTP 200 but resolve to the SPA shell (title remains "부동산 필수 앱 다방") — no DS surface published. Parent company is Station3 (스테이션쓰리); `stationthree.com` returns 200 (corporate page), but no Tech / Design portal. GitHub `forgeinc/stationTHREE` (1 repo, corporate site) is the only org-level surface — no design-system / tokens / Storybook repo.
231
- - **Tier 2 — third-party DS indexes** (negative): `getdesign.md` search "dabang" → no entry. `styles.refero.design` search "dabang" / "다방" → no result cards. Consistent with the systemic KR-coverage gap logged in `2026-05-13-kr10.md` / `2026-05-14-kr10.md`.
232
- - **Tier 3 — competitor cross-reference** (consulted): `references/zigbang/DESIGN.md` (KR-real-estate direct competitor); `references/bunjang/DESIGN.md` (zero-shadow + KR-marketplace radius pattern).
233
- - **Tier 4 — corporate context**: Station3 Co., Ltd. (스테이션쓰리 주식회사), founded 2012, headquartered in Seoul. Dabang launched 2013 as 원룸/투룸 specialist; expanded to 아파트 + 분양 verticals in 2018-2021; current scope covers full-spectrum residential. Acquired by KCC Construction in 2022. Full corporate verification to attribution fidelity not completed this pass — flagged.
234
- - **Tier 5 — anti-pattern survey**: red+yellow "신규!" badge saturation typical of legacy KR property classifieds (네이버 부동산, 직방 pre-2022) used as the negative reference. Dabang's discipline reads against that legacy.
235
-
236
- ## 15. Verification Footer
237
-
238
- - **Tier 1 live capture**: ✓ CDP :9222, 53 raw_samples, 140 :root vars, 2 surfaces — reproducible via `ws://localhost:9222/devtools/page/B7DFD59E5452E64CA14275E072BFAC20` on Chrome/148.
239
- - **Tier 1 official DS**: ✗ AUTHORITATIVE NEGATIVE. No public DS hub, no Storybook, no GitHub design-system repo. Production `:root` token set is the public artifact.
240
- - **Tier 2 indexes**: ✗ getdesign.md empty; ✗ styles.refero.design empty (dabang / 다방).
241
- - **Confidence**: High on §1-§6 (live-captured); Medium on §7-§8 (motion + iconography partially inferred); Low on §11 (personas FILL IN); High on §13 (token table is direct capture).
242
- - **IP guardrails**: Brand assets reference-only. No verbatim taglines. Voice fresh. Service-feature names used descriptively only.
243
- - **Flagged for UPDATE pass**:
244
- - Product-detail page (개별 매물 상세) — spacing scale + price typography
245
- - Filter modal / sort sheet — full state variants
246
- - Mobile viewport 390×844 — Dabang is mobile-first
247
- - Motion tokens — duration/easing
248
- - Listing thumbnail aspect ratio
249
- - Verified Station3 corporate timeline to attribution fidelity
250
-
251
- ## 16. Do's and Don'ts
290
+ ## 14. States
252
291
 
253
- ### Do
254
- - Keep brand pink `#FF3478` (`--pink-500`) on the logo wordmark and large-display contexts only, since at 3.4:1 on white it fails AA for body text
255
- - Drive all interaction state selected map markers, focus rings, link emphasis — with action blue `#326CF9` (`--blue-500`) and its `#EEF8FF` (`--blue-50`) hover tint
256
- - Build depth from 1px `#DFDFDF` (`--gray-400`) hairline borders and background-color steps (white `#F5F5F5` `#EEF8FF`), keeping `box-shadow: none` everywhere
257
- - Set body text in `#222` (`--gray-900`) at 16px/400 and run a binary 400→700 weight rhythm, reserving 500 for map filter-chip labels
258
- - Preserve the contextual radius ladder by using 32px pills for search-entry CTAs and 42px pills for toggleable map filter chips
259
- - Render price as the map marker itself (e.g. '전세 3.2억') and let warmth surface only in the AI band — 24px/400 with a single 🔍 emoji
292
+ | Evidence area | Verified state boundary |
293
+ |---|---|
294
+ | Header account and outline controls | Default visual values only |
295
+ | Map location search and dock control | Default visual values only |
296
+ | Support FAQ row | Default documentation-row visual values only |
260
297
 
261
- ### Don't
262
- - Spread `--pink-500` into product chrome — keeping it wordmark-only is the system's most disciplined rule, and bleeding it onto the map produces a saturated pink that fights the canvas
263
- - Adopt the zero-shadow rule without investing in clean 1px `#DFDFDF` hairlines, since borders are doing the depth work shadows would
264
- - Flatten the 32px and 42px pill radii into one value, which loses the affordance distinction between search-entry CTA and toggle-filter
265
- - Propagate the 400-weight AI-band tone across the surface it only reads as editorial because the surrounding section heads are 700-bold at 18-20px
266
- - Bleed casual `-요` endings into structural labels — warmth lives in the AI surface while category labels stay bare nouns (원/투룸 · 아파트 · 분양)
267
- - Reuse the dense 14px Korean body stack without re-tuning line-height and letter-spacing, since it is tuned for Pretendard's Korean character rendering
298
+ No interaction expansion was retained, so hover, focus, pressed, disabled, error, empty, loading, success, skeleton, menu, dialog, and toast contracts remain unclaimed.
299
+
300
+ ## 15. Motion & Easing
301
+
302
+ No motion duration, easing curve, or animation behaviour is promoted. The static supplied capture has no interaction records, and any motion implementation must be treated as a local extension with reduced-motion support rather than as verified Dabang behaviour.