oh-my-design-cli 1.6.6 → 1.7.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.
- package/AGENTS.md +1 -1
- package/README.md +8 -8
- package/data/reference-fingerprints.json +1318 -10
- package/dist/bin/oh-my-design.js +1 -1
- package/dist/{install-skills-JNH66GOI.js → install-skills-YYHEC4CS.js} +5 -11
- package/dist/install-skills-YYHEC4CS.js.map +1 -0
- package/package.json +1 -1
- package/skills/claude-design/SKILL.md +7 -2
- package/web/references/11st/DESIGN.md +400 -0
- package/web/references/17live/DESIGN.md +43 -0
- package/web/references/29cm/DESIGN.md +41 -0
- package/web/references/91app/DESIGN.md +31 -0
- package/web/references/ably/DESIGN.md +54 -0
- package/web/references/airbnb/DESIGN.md +58 -0
- package/web/references/airtable/DESIGN.md +39 -0
- package/web/references/alipay/DESIGN.md +50 -0
- package/web/references/amazingtalker/DESIGN.md +434 -0
- package/web/references/appier/DESIGN.md +45 -0
- package/web/references/apple/DESIGN.md +47 -0
- package/web/references/baemin/DESIGN.md +142 -43
- package/web/references/banksalad/DESIGN.md +67 -0
- package/web/references/bilibili/DESIGN.md +45 -0
- package/web/references/bithumb/DESIGN.md +38 -0
- package/web/references/bmw/DESIGN.md +37 -0
- package/web/references/brandi/DESIGN.md +414 -0
- package/web/references/bunjang/DESIGN.md +47 -0
- package/web/references/cakeresume/DESIGN.md +29 -0
- package/web/references/cal/DESIGN.md +52 -0
- package/web/references/catchtable/DESIGN.md +79 -19
- package/web/references/cathay/DESIGN.md +432 -0
- package/web/references/channeltalk/DESIGN.md +48 -0
- package/web/references/class101/DESIGN.md +51 -0
- package/web/references/classting/DESIGN.md +41 -0
- package/web/references/classum/DESIGN.md +43 -0
- package/web/references/claude/DESIGN.md +157 -70
- package/web/references/clay/DESIGN.md +56 -0
- package/web/references/clickhouse/DESIGN.md +50 -0
- package/web/references/cloudflare/DESIGN.md +637 -0
- package/web/references/cohere/DESIGN.md +48 -0
- package/web/references/coinbase/DESIGN.md +139 -5
- package/web/references/coinone/DESIGN.md +39 -0
- package/web/references/composio/DESIGN.md +46 -0
- package/web/references/cookpad/DESIGN.md +37 -0
- package/web/references/coupang/DESIGN.md +57 -2
- package/web/references/cursor/DESIGN.md +44 -0
- package/web/references/dabang/DESIGN.md +57 -19
- package/web/references/dcard/DESIGN.md +57 -0
- package/web/references/dell/DESIGN.md +636 -0
- package/web/references/devsisters/DESIGN.md +29 -0
- package/web/references/discord/DESIGN.md +604 -0
- package/web/references/dji/DESIGN.md +39 -0
- package/web/references/drnow/DESIGN.md +52 -0
- package/web/references/duolingo/DESIGN.md +563 -0
- package/web/references/elevenlabs/DESIGN.md +39 -0
- package/web/references/expo/DESIGN.md +39 -0
- package/web/references/fastcampus/DESIGN.md +50 -0
- package/web/references/ferrari/DESIGN.md +47 -0
- package/web/references/figma/DESIGN.md +44 -0
- package/web/references/finda/DESIGN.md +413 -0
- package/web/references/flex/DESIGN.md +28 -0
- package/web/references/flo/DESIGN.md +43 -0
- package/web/references/framer/DESIGN.md +38 -0
- package/web/references/freee/DESIGN.md +48 -0
- package/web/references/fugle/DESIGN.md +41 -1
- package/web/references/gangnamunni/DESIGN.md +57 -1
- package/web/references/genie/DESIGN.md +415 -0
- package/web/references/github/DESIGN.md +727 -0
- package/web/references/gmarket/DESIGN.md +51 -0
- package/web/references/gogolook/DESIGN.md +25 -1
- package/web/references/gogoro/DESIGN.md +38 -0
- package/web/references/grip/DESIGN.md +39 -0
- package/web/references/hahow/DESIGN.md +26 -0
- package/web/references/hashicorp/DESIGN.md +42 -0
- package/web/references/hogangnono/DESIGN.md +41 -0
- package/web/references/hp/DESIGN.md +563 -0
- package/web/references/hyperconnect/DESIGN.md +393 -0
- package/web/references/hyundaicard/DESIGN.md +24 -0
- package/web/references/ibm/DESIGN.md +44 -0
- package/web/references/ichef/DESIGN.md +44 -0
- package/web/references/ikala/DESIGN.md +400 -0
- package/web/references/inflearn/DESIGN.md +38 -0
- package/web/references/intercom/DESIGN.md +38 -0
- package/web/references/jandi/DESIGN.md +382 -0
- package/web/references/jkopay/DESIGN.md +35 -1
- package/web/references/jobkorea/DESIGN.md +39 -0
- package/web/references/jumpit/DESIGN.md +37 -0
- package/web/references/kakao/DESIGN.md +64 -0
- package/web/references/kakaobank/DESIGN.md +55 -1
- package/web/references/kakaopay/DESIGN.md +59 -0
- package/web/references/kakaot/DESIGN.md +53 -0
- package/web/references/karrot/DESIGN.md +49 -0
- package/web/references/kbank/DESIGN.md +39 -0
- package/web/references/kdan/DESIGN.md +34 -1
- package/web/references/kintone/DESIGN.md +586 -0
- package/web/references/kkbox/DESIGN.md +22 -0
- package/web/references/kkday/DESIGN.md +47 -0
- package/web/references/kmong/DESIGN.md +427 -0
- package/web/references/krafton/DESIGN.md +37 -0
- package/web/references/kraken/DESIGN.md +44 -0
- package/web/references/krds/DESIGN.md +63 -0
- package/web/references/kream/DESIGN.md +32 -0
- package/web/references/kurly/DESIGN.md +38 -1
- package/web/references/laftel/DESIGN.md +40 -0
- package/web/references/lamborghini/DESIGN.md +54 -0
- package/web/references/layerx/DESIGN.md +615 -0
- package/web/references/lezhin/DESIGN.md +47 -0
- package/web/references/line/DESIGN.md +36 -0
- package/web/references/linear.app/DESIGN.md +182 -88
- package/web/references/loom/DESIGN.md +396 -0
- package/web/references/lovable/DESIGN.md +38 -0
- package/web/references/lunit/DESIGN.md +47 -19
- package/web/references/mastercard/DESIGN.md +587 -0
- package/web/references/meituan/DESIGN.md +42 -0
- package/web/references/melon/DESIGN.md +26 -0
- package/web/references/mercari/DESIGN.md +41 -0
- package/web/references/mercury/DESIGN.md +589 -0
- package/web/references/meta/DESIGN.md +615 -0
- package/web/references/millie/DESIGN.md +51 -0
- package/web/references/minimax/DESIGN.md +53 -0
- package/web/references/mintlify/DESIGN.md +45 -0
- package/web/references/miro/DESIGN.md +47 -0
- package/web/references/mistral.ai/DESIGN.md +37 -0
- package/web/references/momoshop/DESIGN.md +43 -0
- package/web/references/money-forward/DESIGN.md +42 -0
- package/web/references/mongodb/DESIGN.md +44 -0
- package/web/references/muji/DESIGN.md +605 -0
- package/web/references/musinsa/DESIGN.md +48 -0
- package/web/references/mustit/DESIGN.md +47 -1
- package/web/references/myrealtrip/DESIGN.md +49 -0
- package/web/references/naver/DESIGN.md +50 -1
- package/web/references/naverwebtoon/DESIGN.md +48 -0
- package/web/references/netflix/DESIGN.md +572 -0
- package/web/references/nexon/DESIGN.md +389 -0
- package/web/references/nhncloud/DESIGN.md +33 -0
- package/web/references/nike/DESIGN.md +588 -0
- package/web/references/note/DESIGN.md +28 -0
- package/web/references/notion/DESIGN.md +48 -0
- package/web/references/nvidia/DESIGN.md +50 -0
- package/web/references/ohouse/DESIGN.md +56 -0
- package/web/references/oliveyoung/DESIGN.md +47 -1
- package/web/references/ollama/DESIGN.md +40 -0
- package/web/references/openai/DESIGN.md +641 -0
- package/web/references/opencode.ai/DESIGN.md +37 -0
- package/web/references/payco/DESIGN.md +40 -0
- package/web/references/paypay/DESIGN.md +656 -0
- package/web/references/pchome/DESIGN.md +439 -0
- package/web/references/perplexity/DESIGN.md +546 -0
- package/web/references/piccollage/DESIGN.md +43 -0
- package/web/references/pinkoi/DESIGN.md +55 -0
- package/web/references/pinterest/DESIGN.md +44 -0
- package/web/references/pixiv/DESIGN.md +613 -0
- package/web/references/pixnet/DESIGN.md +430 -0
- package/web/references/posthog/DESIGN.md +50 -0
- package/web/references/publy/DESIGN.md +52 -0
- package/web/references/qanda/DESIGN.md +49 -1
- package/web/references/ragic/DESIGN.md +444 -0
- package/web/references/ramp/DESIGN.md +634 -0
- package/web/references/rayark/DESIGN.md +22 -0
- package/web/references/raycast/DESIGN.md +45 -0
- package/web/references/remember/DESIGN.md +44 -0
- package/web/references/renault/DESIGN.md +42 -0
- package/web/references/replicate/DESIGN.md +39 -0
- package/web/references/resend/DESIGN.md +44 -0
- package/web/references/retool/DESIGN.md +645 -0
- package/web/references/revolut/DESIGN.md +46 -0
- package/web/references/richart/DESIGN.md +465 -0
- package/web/references/ridi/DESIGN.md +47 -0
- package/web/references/riiid/DESIGN.md +32 -0
- package/web/references/robinhood/DESIGN.md +604 -0
- package/web/references/runwayml/DESIGN.md +45 -0
- package/web/references/sanity/DESIGN.md +50 -0
- package/web/references/sansan/DESIGN.md +631 -0
- package/web/references/sendbird/DESIGN.md +46 -0
- package/web/references/sentry/DESIGN.md +48 -0
- package/web/references/shinhancard/DESIGN.md +421 -0
- package/web/references/shopline/DESIGN.md +431 -0
- package/web/references/slack/DESIGN.md +635 -0
- package/web/references/smarthr/DESIGN.md +48 -0
- package/web/references/smartnews/DESIGN.md +29 -0
- package/web/references/socar/DESIGN.md +35 -0
- package/web/references/soomgo/DESIGN.md +326 -0
- package/web/references/spacex/DESIGN.md +27 -0
- package/web/references/spoon/DESIGN.md +46 -0
- package/web/references/spotify/DESIGN.md +49 -0
- package/web/references/starbucks/DESIGN.md +597 -0
- package/web/references/stripe/DESIGN.md +46 -0
- package/web/references/studio/DESIGN.md +602 -0
- package/web/references/supabase/DESIGN.md +41 -0
- package/web/references/superhuman/DESIGN.md +39 -0
- package/web/references/surveycake/DESIGN.md +442 -0
- package/web/references/tada/DESIGN.md +51 -0
- package/web/references/tesla/DESIGN.md +36 -0
- package/web/references/theverge/DESIGN.md +500 -0
- package/web/references/together.ai/DESIGN.md +33 -0
- package/web/references/toss/DESIGN.md +43 -0
- package/web/references/toss-securities/DESIGN.md +54 -19
- package/web/references/tossbank/DESIGN.md +57 -0
- package/web/references/trenbe/DESIGN.md +41 -0
- package/web/references/triple/DESIGN.md +47 -0
- package/web/references/tumblbug/DESIGN.md +48 -0
- package/web/references/tving/DESIGN.md +40 -0
- package/web/references/uber/DESIGN.md +36 -0
- package/web/references/ubie/DESIGN.md +615 -0
- package/web/references/uniqlo/DESIGN.md +575 -0
- package/web/references/upbit/DESIGN.md +42 -0
- package/web/references/upstage/DESIGN.md +38 -0
- package/web/references/velog/DESIGN.md +28 -0
- package/web/references/vercel/DESIGN.md +44 -0
- package/web/references/voicetube/DESIGN.md +39 -0
- package/web/references/voltagent/DESIGN.md +44 -0
- package/web/references/wadiz/DESIGN.md +71 -19
- package/web/references/wanted/DESIGN.md +46 -0
- package/web/references/warp/DESIGN.md +37 -0
- package/web/references/watcha/DESIGN.md +40 -0
- package/web/references/wavve/DESIGN.md +43 -1
- package/web/references/wconcept/DESIGN.md +45 -0
- package/web/references/webflow/DESIGN.md +49 -0
- package/web/references/wired/DESIGN.md +572 -0
- package/web/references/wise/DESIGN.md +41 -0
- package/web/references/x.ai/DESIGN.md +31 -0
- package/web/references/xiaohongshu/DESIGN.md +39 -0
- package/web/references/yanolja/DESIGN.md +45 -0
- package/web/references/yeogiotte/DESIGN.md +42 -1
- package/web/references/yogiyo/DESIGN.md +50 -0
- package/web/references/yourator/DESIGN.md +453 -0
- package/web/references/zapier/DESIGN.md +41 -0
- package/web/references/zigbang/DESIGN.md +33 -0
- package/web/references/zigzag/DESIGN.md +62 -0
- package/web/references/zozotown/DESIGN.md +578 -0
- package/dist/install-skills-JNH66GOI.js.map +0 -1
|
@@ -2,8 +2,32 @@
|
|
|
2
2
|
"schema_version": 1,
|
|
3
3
|
"generated_at": "2026-06-01T00:00:00Z",
|
|
4
4
|
"generator": "oh-my-design parallel agent extraction (Claude Code Agent tool, no API key)",
|
|
5
|
-
"count":
|
|
5
|
+
"count": 221,
|
|
6
6
|
"items": [
|
|
7
|
+
{
|
|
8
|
+
"id": "11st",
|
|
9
|
+
"primary_color_hex": "#ff0038",
|
|
10
|
+
"category": "e-commerce",
|
|
11
|
+
"visual_theme": "11st (11번가) is one of Korea's largest open-market e-commerce platforms, and its homepage is built for one job: get a shopper from a vast, dense catalog to a purchase decision as fast as possible. The atmosphere is high-density and utilitarian — a white canvas ",
|
|
12
|
+
"voice_fingerprint": {
|
|
13
|
+
"register": "transactional marketplace",
|
|
14
|
+
"sentence_length": "medium declarative",
|
|
15
|
+
"metaphor_density": "low",
|
|
16
|
+
"vocabulary_register": "brand-appropriate"
|
|
17
|
+
},
|
|
18
|
+
"tone_keywords": [
|
|
19
|
+
"dense",
|
|
20
|
+
"value-driven",
|
|
21
|
+
"commerce-first",
|
|
22
|
+
"busy"
|
|
23
|
+
],
|
|
24
|
+
"antipatterns": [
|
|
25
|
+
"minimal"
|
|
26
|
+
],
|
|
27
|
+
"signature_motion": "See §15 Motion.",
|
|
28
|
+
"has_personas": true,
|
|
29
|
+
"category_raw": "e-commerce"
|
|
30
|
+
},
|
|
7
31
|
{
|
|
8
32
|
"id": "17live",
|
|
9
33
|
"primary_color_hex": "#FF4F6E",
|
|
@@ -198,6 +222,32 @@
|
|
|
198
222
|
"has_personas": true,
|
|
199
223
|
"category_raw": "fintech"
|
|
200
224
|
},
|
|
225
|
+
{
|
|
226
|
+
"id": "amazingtalker",
|
|
227
|
+
"primary_color_hex": "#02cab9",
|
|
228
|
+
"category": "consumer-tech",
|
|
229
|
+
"visual_theme": "AmazingTalker is a Taiwanese language-learning marketplace, and its design speaks the language of friendly, approachable confidence rather than institutional gravity. The page opens on a clean white canvas (`#ffffff`) with a single, unmistakable brand signal: ",
|
|
230
|
+
"voice_fingerprint": {
|
|
231
|
+
"register": "warm, learner-facing marketplace",
|
|
232
|
+
"sentence_length": "medium declarative",
|
|
233
|
+
"metaphor_density": "low",
|
|
234
|
+
"vocabulary_register": "brand-appropriate"
|
|
235
|
+
},
|
|
236
|
+
"tone_keywords": [
|
|
237
|
+
"friendly",
|
|
238
|
+
"energetic",
|
|
239
|
+
"encouraging",
|
|
240
|
+
"vivid",
|
|
241
|
+
"approachable"
|
|
242
|
+
],
|
|
243
|
+
"antipatterns": [
|
|
244
|
+
"formal",
|
|
245
|
+
"austere"
|
|
246
|
+
],
|
|
247
|
+
"signature_motion": "See §15 Motion.",
|
|
248
|
+
"has_personas": true,
|
|
249
|
+
"category_raw": "consumer-tech"
|
|
250
|
+
},
|
|
201
251
|
{
|
|
202
252
|
"id": "appier",
|
|
203
253
|
"primary_color_hex": "#1D2EFF",
|
|
@@ -388,6 +438,30 @@
|
|
|
388
438
|
"has_personas": false,
|
|
389
439
|
"category_raw": "Automotive"
|
|
390
440
|
},
|
|
441
|
+
{
|
|
442
|
+
"id": "brandi",
|
|
443
|
+
"primary_color_hex": "#ff204b",
|
|
444
|
+
"category": "e-commerce",
|
|
445
|
+
"visual_theme": "Brandi (브랜디) is a Korean fashion commerce platform whose web and app surfaces read as fast, image-forward, and unapologetically commercial. The page lives on a pure white canvas (`#ffffff`) where near-black ink (`#202429`) carries almost all the type, and a si",
|
|
446
|
+
"voice_fingerprint": {
|
|
447
|
+
"register": "fashion commerce",
|
|
448
|
+
"sentence_length": "medium declarative",
|
|
449
|
+
"metaphor_density": "low",
|
|
450
|
+
"vocabulary_register": "brand-appropriate"
|
|
451
|
+
},
|
|
452
|
+
"tone_keywords": [
|
|
453
|
+
"trendy",
|
|
454
|
+
"fashion-forward",
|
|
455
|
+
"vivid",
|
|
456
|
+
"young"
|
|
457
|
+
],
|
|
458
|
+
"antipatterns": [
|
|
459
|
+
"corporate"
|
|
460
|
+
],
|
|
461
|
+
"signature_motion": "See §15 Motion.",
|
|
462
|
+
"has_personas": true,
|
|
463
|
+
"category_raw": "e-commerce"
|
|
464
|
+
},
|
|
391
465
|
{
|
|
392
466
|
"id": "bunjang",
|
|
393
467
|
"primary_color_hex": "#d80c18",
|
|
@@ -465,6 +539,32 @@
|
|
|
465
539
|
"category_raw": "F&B Booking",
|
|
466
540
|
"country": "KR"
|
|
467
541
|
},
|
|
542
|
+
{
|
|
543
|
+
"id": "cathay",
|
|
544
|
+
"primary_color_hex": "#00512a",
|
|
545
|
+
"category": "finance",
|
|
546
|
+
"visual_theme": "Cathay United Bank (國泰世華銀行) presents the calm, dependable face of one of Taiwan's largest financial groups — and its digital design reflects exactly that institutional weight, rendered with surprising lightness. The homepage opens on an almost-white canvas (`#",
|
|
547
|
+
"voice_fingerprint": {
|
|
548
|
+
"register": "formal, reassuring, institutional finance",
|
|
549
|
+
"sentence_length": "medium declarative",
|
|
550
|
+
"metaphor_density": "low",
|
|
551
|
+
"vocabulary_register": "brand-appropriate"
|
|
552
|
+
},
|
|
553
|
+
"tone_keywords": [
|
|
554
|
+
"trustworthy",
|
|
555
|
+
"corporate",
|
|
556
|
+
"stable",
|
|
557
|
+
"premium",
|
|
558
|
+
"institutional"
|
|
559
|
+
],
|
|
560
|
+
"antipatterns": [
|
|
561
|
+
"playful",
|
|
562
|
+
"experimental"
|
|
563
|
+
],
|
|
564
|
+
"signature_motion": "See §15 Motion.",
|
|
565
|
+
"has_personas": true,
|
|
566
|
+
"category_raw": "finance"
|
|
567
|
+
},
|
|
468
568
|
{
|
|
469
569
|
"id": "channeltalk",
|
|
470
570
|
"primary_color_hex": "#4f46e5",
|
|
@@ -625,6 +725,32 @@
|
|
|
625
725
|
"has_personas": false,
|
|
626
726
|
"category_raw": "Backend"
|
|
627
727
|
},
|
|
728
|
+
{
|
|
729
|
+
"id": "cloudflare",
|
|
730
|
+
"primary_color_hex": "#F6821F",
|
|
731
|
+
"category": "Infrastructure",
|
|
732
|
+
"visual_theme": "Cloudflare is the connectivity-cloud company that sits in front of a meaningful slice of the internet — CDN, DNS, DDoS mitigation, Zero Trust, Workers edge compute. Its visual identity has one job: make planet-scale infrastructure feel *approachable and human* in a category that defaults to cold, blue, enterprise seriousness. The answer is a single, unmistakable move — **Cloudflare Orange (`#F6821",
|
|
733
|
+
"voice_fingerprint": {
|
|
734
|
+
"register": "technical-precise",
|
|
735
|
+
"sentence_length": "medium",
|
|
736
|
+
"metaphor_density": "low",
|
|
737
|
+
"vocabulary_register": "general-professional"
|
|
738
|
+
},
|
|
739
|
+
"tone_keywords": [
|
|
740
|
+
"clear",
|
|
741
|
+
"confident",
|
|
742
|
+
"consistent"
|
|
743
|
+
],
|
|
744
|
+
"antipatterns": [
|
|
745
|
+
"Use Cloudflare Orange (`#F6821F`) for the primary CTA and key interactive accents — and almost nowhere else.",
|
|
746
|
+
"Set technical strings (IPs, DNS records, tokens, code) in JetBrains Mono / monospace.",
|
|
747
|
+
"Use status pills with green/red/yellow + a colored dot for health and proxy state.",
|
|
748
|
+
"Prefer 1px `#EDEDED` borders to define panels; keep shadows subtle and neutral."
|
|
749
|
+
],
|
|
750
|
+
"signature_motion": "*Durations** (named, not raw ms):",
|
|
751
|
+
"has_personas": true,
|
|
752
|
+
"category_raw": "backend-devops"
|
|
753
|
+
},
|
|
628
754
|
{
|
|
629
755
|
"id": "cohere",
|
|
630
756
|
"primary_color_hex": "#1863dc",
|
|
@@ -837,6 +963,32 @@
|
|
|
837
963
|
"has_personas": false,
|
|
838
964
|
"category_raw": "social"
|
|
839
965
|
},
|
|
966
|
+
{
|
|
967
|
+
"id": "dell",
|
|
968
|
+
"primary_color_hex": "#0076CE",
|
|
969
|
+
"category": "Consumer",
|
|
970
|
+
"visual_theme": "Dell is one of the world's largest hardware makers, and its digital surfaces carry the weight of that scale: a global commerce engine selling laptops, monitors, servers, and workstations to consumers, gamers, small businesses, and Fortune 500 IT departments simultaneously. The interface has to feel **trustworthy, efficient, and calmly authoritative** -- this is where someone configures a $4,000 wo",
|
|
971
|
+
"voice_fingerprint": {
|
|
972
|
+
"register": "approachable",
|
|
973
|
+
"sentence_length": "medium",
|
|
974
|
+
"metaphor_density": "medium",
|
|
975
|
+
"vocabulary_register": "general-professional"
|
|
976
|
+
},
|
|
977
|
+
"tone_keywords": [
|
|
978
|
+
"clear",
|
|
979
|
+
"confident",
|
|
980
|
+
"consistent"
|
|
981
|
+
],
|
|
982
|
+
"antipatterns": [
|
|
983
|
+
"Use Dell Blue (`#0076CE`) for all interactive elements -- buttons, links, focus rings, active tabs",
|
|
984
|
+
"Use Roboto across all UI in weights 400 / 500 / 700",
|
|
985
|
+
"Define cards and inputs with 1px `#DDE1E6` borders, adding shadow only on hover/overlay",
|
|
986
|
+
"Use tabular numerals for prices, quantities, and spec values"
|
|
987
|
+
],
|
|
988
|
+
"signature_motion": "*Durations** (named, not raw milliseconds):",
|
|
989
|
+
"has_personas": true,
|
|
990
|
+
"category_raw": "consumer-tech"
|
|
991
|
+
},
|
|
840
992
|
{
|
|
841
993
|
"id": "devsisters",
|
|
842
994
|
"primary_color_hex": "#FF5F00",
|
|
@@ -866,6 +1018,32 @@
|
|
|
866
1018
|
"has_personas": true,
|
|
867
1019
|
"category_raw": "consumer-tech"
|
|
868
1020
|
},
|
|
1021
|
+
{
|
|
1022
|
+
"id": "discord",
|
|
1023
|
+
"primary_color_hex": "#5865F2",
|
|
1024
|
+
"category": "Consumer",
|
|
1025
|
+
"visual_theme": "Discord is the place where communities hang out, and its interface is built to feel like a clubhouse, not an enterprise tool. The product UI lives almost entirely in dark mode by default — deep slate-navy surfaces (`#313338` chat, `#2B2D31` channel sidebar, `#1E1F22` server rail) layered like physical panels, with one electric accent doing all the talking: **Blurple** (`#5865F2`). Blurple is a por",
|
|
1026
|
+
"voice_fingerprint": {
|
|
1027
|
+
"register": "approachable",
|
|
1028
|
+
"sentence_length": "medium",
|
|
1029
|
+
"metaphor_density": "medium",
|
|
1030
|
+
"vocabulary_register": "general-professional"
|
|
1031
|
+
},
|
|
1032
|
+
"tone_keywords": [
|
|
1033
|
+
"clear",
|
|
1034
|
+
"confident",
|
|
1035
|
+
"consistent"
|
|
1036
|
+
],
|
|
1037
|
+
"antipatterns": [
|
|
1038
|
+
"Use Blurple (`#5865F2`) for the single primary action and all interactive accents",
|
|
1039
|
+
"Build the product UI dark-first with the three layered surfaces (`#1E1F22` / `#2B2D31` / `#313338`)",
|
|
1040
|
+
"Use soft white (`#DBDEE1`) for body text, reserving pure white for headers/usernames",
|
|
1041
|
+
"Use green (`#23A55A`) for toggles and online status, not Blurple"
|
|
1042
|
+
],
|
|
1043
|
+
"signature_motion": "*Durations:**",
|
|
1044
|
+
"has_personas": true,
|
|
1045
|
+
"category_raw": "consumer-tech"
|
|
1046
|
+
},
|
|
869
1047
|
{
|
|
870
1048
|
"id": "dji",
|
|
871
1049
|
"primary_color_hex": "#000000",
|
|
@@ -925,6 +1103,32 @@
|
|
|
925
1103
|
"has_personas": true,
|
|
926
1104
|
"category_raw": "healthcare / telemedicine / KR consumer app"
|
|
927
1105
|
},
|
|
1106
|
+
{
|
|
1107
|
+
"id": "duolingo",
|
|
1108
|
+
"primary_color_hex": "#58CC02",
|
|
1109
|
+
"category": "Education",
|
|
1110
|
+
"visual_theme": "Duolingo is the world's most-downloaded education app, and its interface is engineered to feel less like studying and more like a game you can't put down. The brand's whole thesis is that learning should be *fun first* — and the visual language enforces that on every pixel. The signature **Feather Green** (`#58CC02`) is an almost impossibly bright, optimistic lime that reads as energy, growth, and",
|
|
1111
|
+
"voice_fingerprint": {
|
|
1112
|
+
"register": "playful",
|
|
1113
|
+
"sentence_length": "medium",
|
|
1114
|
+
"metaphor_density": "medium",
|
|
1115
|
+
"vocabulary_register": "general-professional"
|
|
1116
|
+
},
|
|
1117
|
+
"tone_keywords": [
|
|
1118
|
+
"clear",
|
|
1119
|
+
"confident",
|
|
1120
|
+
"consistent"
|
|
1121
|
+
],
|
|
1122
|
+
"antipatterns": [
|
|
1123
|
+
"Use Feather Green (`#58CC02`) for the single primary action on every screen",
|
|
1124
|
+
"Give buttons the solid 3D lip (`0 4px 0` in a darker shade of the same color)",
|
|
1125
|
+
"Use 2px outlines on cards instead of soft drop shadows",
|
|
1126
|
+
"Set body/heading text in Eel (`#4B4B4B`), never pure black"
|
|
1127
|
+
],
|
|
1128
|
+
"signature_motion": "*Durations** (named):",
|
|
1129
|
+
"has_personas": true,
|
|
1130
|
+
"category_raw": "education"
|
|
1131
|
+
},
|
|
928
1132
|
{
|
|
929
1133
|
"id": "elevenlabs",
|
|
930
1134
|
"primary_color_hex": "#ffffff",
|
|
@@ -1033,6 +1237,31 @@
|
|
|
1033
1237
|
"has_personas": true,
|
|
1034
1238
|
"category_raw": "design-tools"
|
|
1035
1239
|
},
|
|
1240
|
+
{
|
|
1241
|
+
"id": "finda",
|
|
1242
|
+
"primary_color_hex": "#4e2eed",
|
|
1243
|
+
"category": "fintech",
|
|
1244
|
+
"visual_theme": "Finda (핀다) is Korea's design-forward loan-comparison fintech, and its homepage reads like a calm, editorial financial product rather than a hard-sell lending site. The canvas is pure white (`#ffffff`) layered with a soft cool-grey surface (`#f5f6fa`) that segm",
|
|
1245
|
+
"voice_fingerprint": {
|
|
1246
|
+
"register": "loan-comparison fintech",
|
|
1247
|
+
"sentence_length": "medium declarative",
|
|
1248
|
+
"metaphor_density": "low",
|
|
1249
|
+
"vocabulary_register": "brand-appropriate"
|
|
1250
|
+
},
|
|
1251
|
+
"tone_keywords": [
|
|
1252
|
+
"clean",
|
|
1253
|
+
"trustworthy",
|
|
1254
|
+
"approachable",
|
|
1255
|
+
"modern"
|
|
1256
|
+
],
|
|
1257
|
+
"antipatterns": [
|
|
1258
|
+
"heavy",
|
|
1259
|
+
"corporate-cold"
|
|
1260
|
+
],
|
|
1261
|
+
"signature_motion": "See §15 Motion.",
|
|
1262
|
+
"has_personas": true,
|
|
1263
|
+
"category_raw": "fintech"
|
|
1264
|
+
},
|
|
1036
1265
|
{
|
|
1037
1266
|
"id": "flex",
|
|
1038
1267
|
"primary_color_hex": "#000000",
|
|
@@ -1176,6 +1405,56 @@
|
|
|
1176
1405
|
"has_personas": true,
|
|
1177
1406
|
"category_raw": "Healthcare / Cosmetic-Procedure Discovery"
|
|
1178
1407
|
},
|
|
1408
|
+
{
|
|
1409
|
+
"id": "genie",
|
|
1410
|
+
"primary_color_hex": "#fa4065",
|
|
1411
|
+
"category": "consumer-tech",
|
|
1412
|
+
"visual_theme": "Genie Music (지니뮤직) is a Korean music-streaming service whose web surface reads as a dense, utilitarian catalog rather than a glossy marketing site — and that density is the point. The page opens on a pure white canvas (`#ffffff`) carrying a tightly packed info",
|
|
1413
|
+
"voice_fingerprint": {
|
|
1414
|
+
"register": "music streaming",
|
|
1415
|
+
"sentence_length": "medium declarative",
|
|
1416
|
+
"metaphor_density": "low",
|
|
1417
|
+
"vocabulary_register": "brand-appropriate"
|
|
1418
|
+
},
|
|
1419
|
+
"tone_keywords": [
|
|
1420
|
+
"vibrant",
|
|
1421
|
+
"entertainment",
|
|
1422
|
+
"youthful",
|
|
1423
|
+
"bold"
|
|
1424
|
+
],
|
|
1425
|
+
"antipatterns": [
|
|
1426
|
+
"austere"
|
|
1427
|
+
],
|
|
1428
|
+
"signature_motion": "See §15 Motion.",
|
|
1429
|
+
"has_personas": true,
|
|
1430
|
+
"category_raw": "consumer-tech"
|
|
1431
|
+
},
|
|
1432
|
+
{
|
|
1433
|
+
"id": "github",
|
|
1434
|
+
"primary_color_hex": "#0969da",
|
|
1435
|
+
"category": "Developer Tools",
|
|
1436
|
+
"visual_theme": "GitHub is the home of the world's software, and its interface reflects a deliberate engineering aesthetic: precise, legible, and quietly confident. The product surface is built on **Primer**, GitHub's open-source design system — a token-driven framework that has powered github.com for over a decade. The atmosphere is utilitarian without being cold; it is the visual language of a tool used eight ho",
|
|
1437
|
+
"voice_fingerprint": {
|
|
1438
|
+
"register": "technical-precise",
|
|
1439
|
+
"sentence_length": "medium",
|
|
1440
|
+
"metaphor_density": "low",
|
|
1441
|
+
"vocabulary_register": "developer"
|
|
1442
|
+
},
|
|
1443
|
+
"tone_keywords": [
|
|
1444
|
+
"clear",
|
|
1445
|
+
"confident",
|
|
1446
|
+
"consistent"
|
|
1447
|
+
],
|
|
1448
|
+
"antipatterns": [
|
|
1449
|
+
"Use green (`#1f883d`) for the primary constructive action — this is GitHub's signature; commit/create/merge are green, never blue",
|
|
1450
|
+
"Use blue (`#0969da`) for links and focus, not for primary buttons",
|
|
1451
|
+
"Specify every component in both light and dark — dark mode is first-class, not optional",
|
|
1452
|
+
"Use 1px borders (`#d1d9e0`) to structure content; reserve shadows for floating layers only"
|
|
1453
|
+
],
|
|
1454
|
+
"signature_motion": "GitHub motion is **minimal and functional** — this is a productivity tool, and animation that delays a developer is a tax.",
|
|
1455
|
+
"has_personas": true,
|
|
1456
|
+
"category_raw": "developer-tools"
|
|
1457
|
+
},
|
|
1179
1458
|
{
|
|
1180
1459
|
"id": "gmarket",
|
|
1181
1460
|
"primary_color_hex": "#ffd200",
|
|
@@ -1356,6 +1635,56 @@
|
|
|
1356
1635
|
"has_personas": true,
|
|
1357
1636
|
"category_raw": "consumer-tech / proptech / real estate transparency"
|
|
1358
1637
|
},
|
|
1638
|
+
{
|
|
1639
|
+
"id": "hp",
|
|
1640
|
+
"primary_color_hex": "#0096D6",
|
|
1641
|
+
"category": "Consumer",
|
|
1642
|
+
"visual_theme": "HP is one of the founding companies of Silicon Valley, and its digital surfaces carry that legacy with a deliberate, engineered calm. The hp.com experience opens on bright white (`#ffffff`) with near-black text (`#212121`) and a single, unmistakable accent: **HP Blue** (`#0096D6`) — a clean, confident cyan-leaning blue that has been the brand's signature since 2012. The atmosphere is precise but a",
|
|
1643
|
+
"voice_fingerprint": {
|
|
1644
|
+
"register": "approachable",
|
|
1645
|
+
"sentence_length": "medium",
|
|
1646
|
+
"metaphor_density": "medium",
|
|
1647
|
+
"vocabulary_register": "general-professional"
|
|
1648
|
+
},
|
|
1649
|
+
"tone_keywords": [
|
|
1650
|
+
"clear",
|
|
1651
|
+
"confident",
|
|
1652
|
+
"consistent"
|
|
1653
|
+
],
|
|
1654
|
+
"antipatterns": [
|
|
1655
|
+
"Use HP Blue (`#0096D6`) for every interactive element — links, buttons, focus, toggles, active tabs",
|
|
1656
|
+
"Keep foreground text black (`#212121`) or white only, per HP brand guidelines",
|
|
1657
|
+
"Write headlines and labels in sentence case",
|
|
1658
|
+
"Use Forma DJR with weights 400 / 600 / 700 only"
|
|
1659
|
+
],
|
|
1660
|
+
"signature_motion": "*Durations:**",
|
|
1661
|
+
"has_personas": true,
|
|
1662
|
+
"category_raw": "consumer-tech"
|
|
1663
|
+
},
|
|
1664
|
+
{
|
|
1665
|
+
"id": "hyperconnect",
|
|
1666
|
+
"primary_color_hex": "#00dd99",
|
|
1667
|
+
"category": "consumer-tech",
|
|
1668
|
+
"visual_theme": "Hyperconnect's corporate site reads as a confident, globally-minded engineering company that happens to build social video at planetary scale. The atmosphere is bright, clean, and editorial: large stretches of pure white (`#ffffff`) and near-white surfaces (`#",
|
|
1669
|
+
"voice_fingerprint": {
|
|
1670
|
+
"register": "video/AI tech, corporate",
|
|
1671
|
+
"sentence_length": "medium declarative",
|
|
1672
|
+
"metaphor_density": "low",
|
|
1673
|
+
"vocabulary_register": "brand-appropriate"
|
|
1674
|
+
},
|
|
1675
|
+
"tone_keywords": [
|
|
1676
|
+
"modern",
|
|
1677
|
+
"technical",
|
|
1678
|
+
"global",
|
|
1679
|
+
"confident"
|
|
1680
|
+
],
|
|
1681
|
+
"antipatterns": [
|
|
1682
|
+
"playful"
|
|
1683
|
+
],
|
|
1684
|
+
"signature_motion": "See §15 Motion.",
|
|
1685
|
+
"has_personas": true,
|
|
1686
|
+
"category_raw": "consumer-tech"
|
|
1687
|
+
},
|
|
1359
1688
|
{
|
|
1360
1689
|
"id": "hyundaicard",
|
|
1361
1690
|
"primary_color_hex": "#000000",
|
|
@@ -1436,6 +1765,32 @@
|
|
|
1436
1765
|
"has_personas": true,
|
|
1437
1766
|
"category_raw": "restaurant-saas-pos"
|
|
1438
1767
|
},
|
|
1768
|
+
{
|
|
1769
|
+
"id": "ikala",
|
|
1770
|
+
"primary_color_hex": "#061232",
|
|
1771
|
+
"category": "developer-tools",
|
|
1772
|
+
"visual_theme": "iKala's website presents itself as a clean, corporate-confident B2B AI and martech platform built for the Asia-Pacific enterprise buyer. The page opens on a pure white canvas (`#ffffff`) with a restrained, professional palette: deep navy (`#061232`) anchors th",
|
|
1773
|
+
"voice_fingerprint": {
|
|
1774
|
+
"register": "professional, AI/enterprise",
|
|
1775
|
+
"sentence_length": "medium declarative",
|
|
1776
|
+
"metaphor_density": "low",
|
|
1777
|
+
"vocabulary_register": "brand-appropriate"
|
|
1778
|
+
},
|
|
1779
|
+
"tone_keywords": [
|
|
1780
|
+
"technical",
|
|
1781
|
+
"clean",
|
|
1782
|
+
"B2B",
|
|
1783
|
+
"confident",
|
|
1784
|
+
"modern"
|
|
1785
|
+
],
|
|
1786
|
+
"antipatterns": [
|
|
1787
|
+
"playful",
|
|
1788
|
+
"cluttered"
|
|
1789
|
+
],
|
|
1790
|
+
"signature_motion": "See §15 Motion.",
|
|
1791
|
+
"has_personas": true,
|
|
1792
|
+
"category_raw": "developer-tools"
|
|
1793
|
+
},
|
|
1439
1794
|
{
|
|
1440
1795
|
"id": "inflearn",
|
|
1441
1796
|
"primary_color_hex": "#00c471",
|
|
@@ -1467,6 +1822,30 @@
|
|
|
1467
1822
|
"has_personas": false,
|
|
1468
1823
|
"category_raw": "customer service / AI helpdesk SaaS"
|
|
1469
1824
|
},
|
|
1825
|
+
{
|
|
1826
|
+
"id": "jandi",
|
|
1827
|
+
"primary_color_hex": "#00c473",
|
|
1828
|
+
"category": "productivity",
|
|
1829
|
+
"visual_theme": "JANDI (잔디) is the Korean business-collaboration messenger built by TossLab, and its website carries the calm, trustworthy confidence of a productivity tool that lives in offices all day. The page opens on a clean white canvas (`#ffffff`) — occasionally cooling",
|
|
1830
|
+
"voice_fingerprint": {
|
|
1831
|
+
"register": "team collaboration SaaS",
|
|
1832
|
+
"sentence_length": "medium declarative",
|
|
1833
|
+
"metaphor_density": "low",
|
|
1834
|
+
"vocabulary_register": "brand-appropriate"
|
|
1835
|
+
},
|
|
1836
|
+
"tone_keywords": [
|
|
1837
|
+
"clean",
|
|
1838
|
+
"productive",
|
|
1839
|
+
"friendly",
|
|
1840
|
+
"modern"
|
|
1841
|
+
],
|
|
1842
|
+
"antipatterns": [
|
|
1843
|
+
"heavy"
|
|
1844
|
+
],
|
|
1845
|
+
"signature_motion": "See §15 Motion.",
|
|
1846
|
+
"has_personas": true,
|
|
1847
|
+
"category_raw": "productivity"
|
|
1848
|
+
},
|
|
1470
1849
|
{
|
|
1471
1850
|
"id": "jkopay",
|
|
1472
1851
|
"primary_color_hex": "#C9191D",
|
|
@@ -1712,6 +2091,32 @@
|
|
|
1712
2091
|
"has_personas": true,
|
|
1713
2092
|
"category_raw": "productivity / document-workflow SaaS"
|
|
1714
2093
|
},
|
|
2094
|
+
{
|
|
2095
|
+
"id": "kintone",
|
|
2096
|
+
"primary_color_hex": "#ef3f24",
|
|
2097
|
+
"category": "Productivity",
|
|
2098
|
+
"visual_theme": "kintone is Cybozu's no-code/low-code work platform — the tool a non-engineer reaches for when they want to turn a messy spreadsheet and an email thread into a real business application. Its design language reflects that mission: approachable, friendly, and unintimidating, but grounded enough that a sales team, a city government office, or a manufacturing floor all trust it with their daily operati",
|
|
2099
|
+
"voice_fingerprint": {
|
|
2100
|
+
"register": "b2b-confident",
|
|
2101
|
+
"sentence_length": "medium",
|
|
2102
|
+
"metaphor_density": "low",
|
|
2103
|
+
"vocabulary_register": "general-professional"
|
|
2104
|
+
},
|
|
2105
|
+
"tone_keywords": [
|
|
2106
|
+
"clear",
|
|
2107
|
+
"confident",
|
|
2108
|
+
"consistent"
|
|
2109
|
+
],
|
|
2110
|
+
"antipatterns": [
|
|
2111
|
+
"Use KIN Red (`#ef3f24`) for the primary CTA and brand moments — it is the one hero color",
|
|
2112
|
+
"Pair red with the named secondary hues (Shamrock, Cerulean, Aloe, Sunshine) for category color-coding",
|
|
2113
|
+
"Use the Meiryo → Hiragino → Noto Sans JP stack for Japanese-first legibility",
|
|
2114
|
+
"Keep body line-height generous (1.7) for dense Japanese text"
|
|
2115
|
+
],
|
|
2116
|
+
"signature_motion": "*Durations** (named, not raw milliseconds):",
|
|
2117
|
+
"has_personas": true,
|
|
2118
|
+
"category_raw": "productivity"
|
|
2119
|
+
},
|
|
1715
2120
|
{
|
|
1716
2121
|
"id": "kkbox",
|
|
1717
2122
|
"primary_color_hex": "#00B6E1",
|
|
@@ -1771,6 +2176,30 @@
|
|
|
1771
2176
|
"has_personas": true,
|
|
1772
2177
|
"category_raw": "ecommerce"
|
|
1773
2178
|
},
|
|
2179
|
+
{
|
|
2180
|
+
"id": "kmong",
|
|
2181
|
+
"primary_color_hex": "#92fa72",
|
|
2182
|
+
"category": "consumer-tech",
|
|
2183
|
+
"visual_theme": "Kmong (크몽) is Korea's largest freelance and skill marketplace, and its homepage reads exactly like what it is: a high-trust, high-volume transaction surface designed to move a buyer from \"I have a problem\" to \"I hired the right expert\" with the least possible ",
|
|
2184
|
+
"voice_fingerprint": {
|
|
2185
|
+
"register": "freelance marketplace, can-do",
|
|
2186
|
+
"sentence_length": "medium declarative",
|
|
2187
|
+
"metaphor_density": "low",
|
|
2188
|
+
"vocabulary_register": "brand-appropriate"
|
|
2189
|
+
},
|
|
2190
|
+
"tone_keywords": [
|
|
2191
|
+
"practical",
|
|
2192
|
+
"approachable",
|
|
2193
|
+
"vivid",
|
|
2194
|
+
"energetic"
|
|
2195
|
+
],
|
|
2196
|
+
"antipatterns": [
|
|
2197
|
+
"austere"
|
|
2198
|
+
],
|
|
2199
|
+
"signature_motion": "See §15 Motion.",
|
|
2200
|
+
"has_personas": true,
|
|
2201
|
+
"category_raw": "consumer-tech"
|
|
2202
|
+
},
|
|
1774
2203
|
{
|
|
1775
2204
|
"id": "krafton",
|
|
1776
2205
|
"primary_color_hex": "#000000",
|
|
@@ -1947,14 +2376,40 @@
|
|
|
1947
2376
|
"category_raw": "luxury automotive"
|
|
1948
2377
|
},
|
|
1949
2378
|
{
|
|
1950
|
-
"id": "
|
|
1951
|
-
"primary_color_hex": "#
|
|
1952
|
-
"category": "
|
|
1953
|
-
"visual_theme": "
|
|
2379
|
+
"id": "layerx",
|
|
2380
|
+
"primary_color_hex": "#534DFF",
|
|
2381
|
+
"category": "Fintech",
|
|
2382
|
+
"visual_theme": "LayerX is a Tokyo-based \"compound startup\" whose mission — *すべての経済活動を、デジタル化する* (\"digitize all economic activity\") — sets the tone for a design language that is at once corporate-trustworthy and quietly futuristic. The brand's flagship is the **Bakuraku (バクラク)** suite, cloud back-office software for corporate spend, invoices, and expense management; the parent site (`layerx.co.jp`) is a refined mod",
|
|
1954
2383
|
"voice_fingerprint": {
|
|
1955
|
-
"register": "
|
|
1956
|
-
"sentence_length": "
|
|
1957
|
-
"metaphor_density": "low",
|
|
2384
|
+
"register": "b2b-confident",
|
|
2385
|
+
"sentence_length": "medium",
|
|
2386
|
+
"metaphor_density": "low",
|
|
2387
|
+
"vocabulary_register": "finance-professional"
|
|
2388
|
+
},
|
|
2389
|
+
"tone_keywords": [
|
|
2390
|
+
"clear",
|
|
2391
|
+
"confident",
|
|
2392
|
+
"consistent"
|
|
2393
|
+
],
|
|
2394
|
+
"antipatterns": [
|
|
2395
|
+
"Use LayerX Indigo (`#534DFF`) for all primary interactive elements — CTAs, links, focus rings, active tabs.",
|
|
2396
|
+
"Keep the canvas white and let whitespace carry the corporate, trustworthy feel.",
|
|
2397
|
+
"Use the navy ink (`#152632`) for headings instead of pure black — softer, on-brand.",
|
|
2398
|
+
"Pair indigo with sky blue (`#8DBBFF`) only for gradients, illustration, and decorative fills."
|
|
2399
|
+
],
|
|
2400
|
+
"signature_motion": "*Durations:**",
|
|
2401
|
+
"has_personas": true,
|
|
2402
|
+
"category_raw": "fintech"
|
|
2403
|
+
},
|
|
2404
|
+
{
|
|
2405
|
+
"id": "lezhin",
|
|
2406
|
+
"primary_color_hex": "#eb0014",
|
|
2407
|
+
"category": "consumer-tech",
|
|
2408
|
+
"visual_theme": "dark-immersive content-first",
|
|
2409
|
+
"voice_fingerprint": {
|
|
2410
|
+
"register": "direct and candid",
|
|
2411
|
+
"sentence_length": "short declarative",
|
|
2412
|
+
"metaphor_density": "low",
|
|
1958
2413
|
"vocabulary_register": "informal-adult"
|
|
1959
2414
|
},
|
|
1960
2415
|
"tone_keywords": [
|
|
@@ -2026,6 +2481,33 @@
|
|
|
2026
2481
|
"has_personas": true,
|
|
2027
2482
|
"category_raw": "developer tools / project management SaaS"
|
|
2028
2483
|
},
|
|
2484
|
+
{
|
|
2485
|
+
"id": "loom",
|
|
2486
|
+
"primary_color_hex": "#1868db",
|
|
2487
|
+
"category": "productivity",
|
|
2488
|
+
"visual_theme": "Friendly-confident consumer-prosumer tool: pure-white canvas, near-black ink, single saturated cobalt #1868db on pill CTAs, bold Charlie Display headlines (700) with editorial loudness, coral/purple gradient illustration accents.",
|
|
2489
|
+
"voice_fingerprint": {
|
|
2490
|
+
"register": "warm, direct, encouraging",
|
|
2491
|
+
"sentence_length": "short punchy declarative",
|
|
2492
|
+
"metaphor_density": "low",
|
|
2493
|
+
"vocabulary_register": "plain consumer-friendly, action-oriented"
|
|
2494
|
+
},
|
|
2495
|
+
"tone_keywords": [
|
|
2496
|
+
"friendly",
|
|
2497
|
+
"bold",
|
|
2498
|
+
"approachable",
|
|
2499
|
+
"energetic",
|
|
2500
|
+
"confident"
|
|
2501
|
+
],
|
|
2502
|
+
"antipatterns": [
|
|
2503
|
+
"corporate-cold",
|
|
2504
|
+
"whisper-weight",
|
|
2505
|
+
"intimidating"
|
|
2506
|
+
],
|
|
2507
|
+
"signature_motion": "Carousel arrows on white circular icon-buttons with soft multi-layer shadows; energetic but unobtrusive.",
|
|
2508
|
+
"has_personas": false,
|
|
2509
|
+
"category_raw": "async video messaging / productivity SaaS"
|
|
2510
|
+
},
|
|
2029
2511
|
{
|
|
2030
2512
|
"id": "lovable",
|
|
2031
2513
|
"primary_color_hex": "#1c1c1c",
|
|
@@ -2060,6 +2542,32 @@
|
|
|
2060
2542
|
"category_raw": "Medical Imaging AI",
|
|
2061
2543
|
"country": "KR"
|
|
2062
2544
|
},
|
|
2545
|
+
{
|
|
2546
|
+
"id": "mastercard",
|
|
2547
|
+
"primary_color_hex": "#EB001B",
|
|
2548
|
+
"category": "Fintech",
|
|
2549
|
+
"visual_theme": "Mastercard is one of the most recognized brands on earth, and its design language is built around a single, indelible asset: the two interlocking circles. Red (`#EB001B`) on the left, yellow-orange (`#F79E1B`) on the right, and a warm orange (`#FF5F00`) where they overlap. That mark — refined to its purest form in the 2016/2019 Pentagram redesign — is the entire visual thesis: two halves coming to",
|
|
2550
|
+
"voice_fingerprint": {
|
|
2551
|
+
"register": "b2b-confident",
|
|
2552
|
+
"sentence_length": "medium",
|
|
2553
|
+
"metaphor_density": "low",
|
|
2554
|
+
"vocabulary_register": "finance-professional"
|
|
2555
|
+
},
|
|
2556
|
+
"tone_keywords": [
|
|
2557
|
+
"clear",
|
|
2558
|
+
"confident",
|
|
2559
|
+
"consistent"
|
|
2560
|
+
],
|
|
2561
|
+
"antipatterns": [
|
|
2562
|
+
"Protect the interlocking-circles mark with full clear space; never crop or distort it",
|
|
2563
|
+
"Use Mastercard Red (`#EB001B`) as an accent and brand moment, not a universal button fill",
|
|
2564
|
+
"Lead with dark (`#141413`) primary CTAs; reserve red for the single hero action",
|
|
2565
|
+
"Pair red and yellow only through the official overlap orange (`#FF5F00`) in gradients"
|
|
2566
|
+
],
|
|
2567
|
+
"signature_motion": "*Durations:**",
|
|
2568
|
+
"has_personas": true,
|
|
2569
|
+
"category_raw": "fintech"
|
|
2570
|
+
},
|
|
2063
2571
|
{
|
|
2064
2572
|
"id": "meituan",
|
|
2065
2573
|
"primary_color_hex": "#FFC300",
|
|
@@ -2141,6 +2649,58 @@
|
|
|
2141
2649
|
"has_personas": false,
|
|
2142
2650
|
"category_raw": "consumer marketplace"
|
|
2143
2651
|
},
|
|
2652
|
+
{
|
|
2653
|
+
"id": "mercury",
|
|
2654
|
+
"primary_color_hex": "#5266eb",
|
|
2655
|
+
"category": "Fintech",
|
|
2656
|
+
"visual_theme": "Mercury is banking built for startups, and its interface carries the quiet confidence of software made by people who care about craft. The brand refuses the two dominant fintech clichés at once: it is neither the cold institutional navy of legacy banks nor the candy-bright gradients of consumer neobanks. Instead, Mercury occupies a refined, almost cinematic middle ground — deep indigo-black canvas",
|
|
2657
|
+
"voice_fingerprint": {
|
|
2658
|
+
"register": "b2b-confident",
|
|
2659
|
+
"sentence_length": "medium",
|
|
2660
|
+
"metaphor_density": "low",
|
|
2661
|
+
"vocabulary_register": "finance-professional"
|
|
2662
|
+
},
|
|
2663
|
+
"tone_keywords": [
|
|
2664
|
+
"clear",
|
|
2665
|
+
"confident",
|
|
2666
|
+
"consistent"
|
|
2667
|
+
],
|
|
2668
|
+
"antipatterns": [
|
|
2669
|
+
"Use indigo `#5266eb` for the single primary action per section — links, focus rings, the one CTA",
|
|
2670
|
+
"Use the custom 480 weight for headings and key labels",
|
|
2671
|
+
"Use `#ededf3` (off-white), never pure white, for text on dark canvases",
|
|
2672
|
+
"Keep base radius at 4px for buttons, inputs, and badges"
|
|
2673
|
+
],
|
|
2674
|
+
"signature_motion": "*Durations:**",
|
|
2675
|
+
"has_personas": true,
|
|
2676
|
+
"category_raw": "fintech"
|
|
2677
|
+
},
|
|
2678
|
+
{
|
|
2679
|
+
"id": "meta",
|
|
2680
|
+
"primary_color_hex": "#0064E0",
|
|
2681
|
+
"category": "Consumer",
|
|
2682
|
+
"visual_theme": "Meta is the rebrand of Facebook, Inc. into a company organized around connection across the social graph, devices, and the immersive web. Where the old Facebook interface was a wall of utilitarian `#1877F2` blue, the Meta brand is built around motion, depth, and an optimistic gradient that flows from a deep, trustworthy blue (`#0064E0`) into a brighter, almost luminescent cerulean (`#0082FB`). The",
|
|
2683
|
+
"voice_fingerprint": {
|
|
2684
|
+
"register": "approachable",
|
|
2685
|
+
"sentence_length": "medium",
|
|
2686
|
+
"metaphor_density": "medium",
|
|
2687
|
+
"vocabulary_register": "general-professional"
|
|
2688
|
+
},
|
|
2689
|
+
"tone_keywords": [
|
|
2690
|
+
"clear",
|
|
2691
|
+
"confident",
|
|
2692
|
+
"consistent"
|
|
2693
|
+
],
|
|
2694
|
+
"antipatterns": [
|
|
2695
|
+
"Use the Meta Blue gradient (`#0064E0` → `#0082FB`) for brand hero moments and primary marketing CTAs",
|
|
2696
|
+
"Use solid `#0064E0` for product-surface interactive elements (links, buttons, focus)",
|
|
2697
|
+
"Use Optimistic Display for headlines ≥24px, Optimistic Text for body",
|
|
2698
|
+
"Lift white cards off the `#F0F2F5` canvas with subtle ink-tinted shadows"
|
|
2699
|
+
],
|
|
2700
|
+
"signature_motion": "*Durations** (named):",
|
|
2701
|
+
"has_personas": true,
|
|
2702
|
+
"category_raw": "consumer-tech"
|
|
2703
|
+
},
|
|
2144
2704
|
{
|
|
2145
2705
|
"id": "millie",
|
|
2146
2706
|
"primary_color_hex": "#1B6DDA",
|
|
@@ -2341,6 +2901,32 @@
|
|
|
2341
2901
|
"has_personas": false,
|
|
2342
2902
|
"category_raw": "developer database"
|
|
2343
2903
|
},
|
|
2904
|
+
{
|
|
2905
|
+
"id": "muji",
|
|
2906
|
+
"primary_color_hex": "#7f0019",
|
|
2907
|
+
"category": "Commerce",
|
|
2908
|
+
"visual_theme": "MUJI — *Mujirushi Ryohin* (無印良品), \"no-brand quality goods\" — is the rare retailer whose entire visual identity is an argument *against* visual identity. Founded in 1980 as a product line inside the Seiyu supermarket chain, MUJI was a deliberate rejection of the brand-premium economics of late-bubble Japan: strip out the packaging, strip out the logo tax, keep the material quality. The website is t",
|
|
2909
|
+
"voice_fingerprint": {
|
|
2910
|
+
"register": "lifestyle",
|
|
2911
|
+
"sentence_length": "medium",
|
|
2912
|
+
"metaphor_density": "low",
|
|
2913
|
+
"vocabulary_register": "general-professional"
|
|
2914
|
+
},
|
|
2915
|
+
"tone_keywords": [
|
|
2916
|
+
"clear",
|
|
2917
|
+
"confident",
|
|
2918
|
+
"consistent"
|
|
2919
|
+
],
|
|
2920
|
+
"antipatterns": [
|
|
2921
|
+
"Reserve MUJI Maroon (`#7f0019`) for the logo and rare brand accents — treat it as precious",
|
|
2922
|
+
"Use `#333333` for text, never pure `#000000`",
|
|
2923
|
+
"Default to square corners (0px); use 2px only on buttons, inputs, modals",
|
|
2924
|
+
"Separate elements with whitespace and hairline `#dddddd` borders, not shadows"
|
|
2925
|
+
],
|
|
2926
|
+
"signature_motion": "*Durations**:",
|
|
2927
|
+
"has_personas": true,
|
|
2928
|
+
"category_raw": "ecommerce"
|
|
2929
|
+
},
|
|
2344
2930
|
{
|
|
2345
2931
|
"id": "musinsa",
|
|
2346
2932
|
"primary_color_hex": "#000000",
|
|
@@ -2488,6 +3074,56 @@
|
|
|
2488
3074
|
"has_personas": true,
|
|
2489
3075
|
"category_raw": "Content Platform (Webtoon)"
|
|
2490
3076
|
},
|
|
3077
|
+
{
|
|
3078
|
+
"id": "netflix",
|
|
3079
|
+
"primary_color_hex": "#E50914",
|
|
3080
|
+
"category": "Consumer",
|
|
3081
|
+
"visual_theme": "Netflix is the streaming interface that taught the world what \"lean-back\" entertainment software should feel like — a dark, cinematic theater where the content is the only thing that glows. The product opens on near-black (`#141414`) and stays there. There is no white-canvas mode, no light theme in the consumer app; the darkness is not a setting, it is the brand. Against that black, full-bleed art",
|
|
3082
|
+
"voice_fingerprint": {
|
|
3083
|
+
"register": "approachable",
|
|
3084
|
+
"sentence_length": "medium",
|
|
3085
|
+
"metaphor_density": "medium",
|
|
3086
|
+
"vocabulary_register": "general-professional"
|
|
3087
|
+
},
|
|
3088
|
+
"tone_keywords": [
|
|
3089
|
+
"clear",
|
|
3090
|
+
"confident",
|
|
3091
|
+
"consistent"
|
|
3092
|
+
],
|
|
3093
|
+
"antipatterns": [
|
|
3094
|
+
"Keep the canvas dark — `#141414` page, `#000000` player. Never a light theme in the consumer app.",
|
|
3095
|
+
"Reserve Netflix Red (`#E50914`) for the logo, the primary marketing CTA, progress fills, and \"New\" markers.",
|
|
3096
|
+
"Use white (`#FFFFFF`) as the primary in-app action color (the Play button); red is for acquisition.",
|
|
3097
|
+
"Default body/metadata text to grey `#B3B3B3`; reserve white for the single most important label."
|
|
3098
|
+
],
|
|
3099
|
+
"signature_motion": "*Durations:**",
|
|
3100
|
+
"has_personas": true,
|
|
3101
|
+
"category_raw": "consumer-tech"
|
|
3102
|
+
},
|
|
3103
|
+
{
|
|
3104
|
+
"id": "nexon",
|
|
3105
|
+
"primary_color_hex": "#00de5a",
|
|
3106
|
+
"category": "consumer-tech",
|
|
3107
|
+
"visual_theme": "Nexon's website is the digital storefront of one of Korea's largest game publishers, and its design reflects a deliberate split personality: an editorial, almost corporate calm in the chrome, broken by sudden bursts of high-voltage brand green. The page sits o",
|
|
3108
|
+
"voice_fingerprint": {
|
|
3109
|
+
"register": "game publisher",
|
|
3110
|
+
"sentence_length": "medium declarative",
|
|
3111
|
+
"metaphor_density": "low",
|
|
3112
|
+
"vocabulary_register": "brand-appropriate"
|
|
3113
|
+
},
|
|
3114
|
+
"tone_keywords": [
|
|
3115
|
+
"bold",
|
|
3116
|
+
"playful",
|
|
3117
|
+
"gaming",
|
|
3118
|
+
"energetic"
|
|
3119
|
+
],
|
|
3120
|
+
"antipatterns": [
|
|
3121
|
+
"corporate-stiff"
|
|
3122
|
+
],
|
|
3123
|
+
"signature_motion": "See §15 Motion.",
|
|
3124
|
+
"has_personas": true,
|
|
3125
|
+
"category_raw": "consumer-tech"
|
|
3126
|
+
},
|
|
2491
3127
|
{
|
|
2492
3128
|
"id": "nhncloud",
|
|
2493
3129
|
"primary_color_hex": "#125DE6",
|
|
@@ -2517,6 +3153,32 @@
|
|
|
2517
3153
|
"has_personas": true,
|
|
2518
3154
|
"category_raw": "backend-devops / cloud infrastructure (NHN Cloud + TOAST UI)"
|
|
2519
3155
|
},
|
|
3156
|
+
{
|
|
3157
|
+
"id": "nike",
|
|
3158
|
+
"primary_color_hex": "#111111",
|
|
3159
|
+
"category": "Commerce",
|
|
3160
|
+
"visual_theme": "Nike's digital storefront is athletic minimalism turned into a sales engine. The page opens on pure white (`#ffffff`) with near-black ink (`#111111`) and a single high-voltage accent — **Volt** (`#d8ff00` / commonly rendered `#cdfb40`) — held in reserve for moments of energy. The default mood is editorial and confident: enormous product photography sits on generous whitespace, headlines shout in c",
|
|
3161
|
+
"voice_fingerprint": {
|
|
3162
|
+
"register": "lifestyle",
|
|
3163
|
+
"sentence_length": "medium",
|
|
3164
|
+
"metaphor_density": "low",
|
|
3165
|
+
"vocabulary_register": "general-professional"
|
|
3166
|
+
},
|
|
3167
|
+
"tone_keywords": [
|
|
3168
|
+
"clear",
|
|
3169
|
+
"confident",
|
|
3170
|
+
"consistent"
|
|
3171
|
+
],
|
|
3172
|
+
"antipatterns": [
|
|
3173
|
+
"Lead with black (`#111111`) and white (`#ffffff`) — they carry the brand",
|
|
3174
|
+
"Use pill (9999px) buttons as the default interactive shape",
|
|
3175
|
+
"Set headlines in condensed bold UPPERCASE, left-aligned, tight leading",
|
|
3176
|
+
"Ration Volt (`#d8ff00`) for true energy moments — one spark per view"
|
|
3177
|
+
],
|
|
3178
|
+
"signature_motion": "*Durations** (named):",
|
|
3179
|
+
"has_personas": true,
|
|
3180
|
+
"category_raw": "ecommerce"
|
|
3181
|
+
},
|
|
2520
3182
|
{
|
|
2521
3183
|
"id": "note",
|
|
2522
3184
|
"primary_color_hex": "#41C9B4",
|
|
@@ -2662,6 +3324,32 @@
|
|
|
2662
3324
|
"has_personas": false,
|
|
2663
3325
|
"category_raw": "developer AI tool"
|
|
2664
3326
|
},
|
|
3327
|
+
{
|
|
3328
|
+
"id": "openai",
|
|
3329
|
+
"primary_color_hex": "#10a37f",
|
|
3330
|
+
"category": "AI",
|
|
3331
|
+
"visual_theme": "OpenAI's interface is the visual argument that powerful technology should feel quiet. The canvas is uncompromising near-black-on-white (`#0d0d0d` text on `#ffffff`), with the signature teal-green (`#10a37f`) reserved almost exclusively for the moments that matter — the active state, the brand mark, a confirmation. There is no gradient theater, no glassmorphism, no drop-shadow drama. The page reads",
|
|
3332
|
+
"voice_fingerprint": {
|
|
3333
|
+
"register": "clear-confident",
|
|
3334
|
+
"sentence_length": "medium",
|
|
3335
|
+
"metaphor_density": "low",
|
|
3336
|
+
"vocabulary_register": "general-professional"
|
|
3337
|
+
},
|
|
3338
|
+
"tone_keywords": [
|
|
3339
|
+
"clear",
|
|
3340
|
+
"confident",
|
|
3341
|
+
"consistent"
|
|
3342
|
+
],
|
|
3343
|
+
"antipatterns": [
|
|
3344
|
+
"Use OpenAI Teal (`#10a37f`) sparingly — for the mark, active states, and key CTAs only",
|
|
3345
|
+
"Default to near-black `#0d0d0d` on white `#ffffff`; design dark mode as a first-class peer",
|
|
3346
|
+
"Use OpenAI Sans at 400/500/600; apply slight negative tracking on large headings",
|
|
3347
|
+
"Define edges with 1px hairline borders (`#e5e5e5`) before reaching for shadow"
|
|
3348
|
+
],
|
|
3349
|
+
"signature_motion": "*Durations:**",
|
|
3350
|
+
"has_personas": true,
|
|
3351
|
+
"category_raw": "ai"
|
|
3352
|
+
},
|
|
2665
3353
|
{
|
|
2666
3354
|
"id": "opencode.ai",
|
|
2667
3355
|
"primary_color_hex": "#201d1d",
|
|
@@ -2712,6 +3400,84 @@
|
|
|
2712
3400
|
"has_personas": true,
|
|
2713
3401
|
"category_raw": "fintech / payment super-app"
|
|
2714
3402
|
},
|
|
3403
|
+
{
|
|
3404
|
+
"id": "paypay",
|
|
3405
|
+
"primary_color_hex": "#FF0033",
|
|
3406
|
+
"category": "Fintech",
|
|
3407
|
+
"visual_theme": "PayPay is Japan's dominant QR-code mobile wallet — the app that, almost single-handedly, dragged a famously cash-loving country into cashless payments. Its visual language is loud where Japanese fintech is traditionally quiet: a single, screaming **PayPay Red (`#FF0033`)** sits at the center of everything, and the entire interface orbits it. Where a legacy Japanese bank app whispers in navy and gr",
|
|
3408
|
+
"voice_fingerprint": {
|
|
3409
|
+
"register": "b2b-confident",
|
|
3410
|
+
"sentence_length": "medium",
|
|
3411
|
+
"metaphor_density": "low",
|
|
3412
|
+
"vocabulary_register": "finance-professional"
|
|
3413
|
+
},
|
|
3414
|
+
"tone_keywords": [
|
|
3415
|
+
"clear",
|
|
3416
|
+
"confident",
|
|
3417
|
+
"consistent"
|
|
3418
|
+
],
|
|
3419
|
+
"antipatterns": [
|
|
3420
|
+
"Use PayPay Red (`#FF0033`) for the primary money action on every screen — it is the brand and the CTA",
|
|
3421
|
+
"Keep surfaces white / gray-50 and let red carry all the energy",
|
|
3422
|
+
"Use the system Japanese font stack (Hiragino / Noto Sans JP / Yu Gothic) — no webfont required",
|
|
3423
|
+
"Make balances and amounts large and 700 weight — numbers are the emotional payload"
|
|
3424
|
+
],
|
|
3425
|
+
"signature_motion": "*Durations:**",
|
|
3426
|
+
"has_personas": true,
|
|
3427
|
+
"category_raw": "fintech"
|
|
3428
|
+
},
|
|
3429
|
+
{
|
|
3430
|
+
"id": "pchome",
|
|
3431
|
+
"primary_color_hex": "#ea1717",
|
|
3432
|
+
"category": "e-commerce",
|
|
3433
|
+
"visual_theme": "PChome 24h is Taiwan's archetypal high-density marketplace, and its design reflects a single, unwavering priority: get as much shoppable inventory in front of the eye as possible, as fast as possible. Where Western boutique commerce leans on whitespace and one",
|
|
3434
|
+
"voice_fingerprint": {
|
|
3435
|
+
"register": "transactional, deal-led, marketplace",
|
|
3436
|
+
"sentence_length": "medium declarative",
|
|
3437
|
+
"metaphor_density": "low",
|
|
3438
|
+
"vocabulary_register": "brand-appropriate"
|
|
3439
|
+
},
|
|
3440
|
+
"tone_keywords": [
|
|
3441
|
+
"dense",
|
|
3442
|
+
"utilitarian",
|
|
3443
|
+
"value-driven",
|
|
3444
|
+
"busy",
|
|
3445
|
+
"commerce-first"
|
|
3446
|
+
],
|
|
3447
|
+
"antipatterns": [
|
|
3448
|
+
"minimal",
|
|
3449
|
+
"airy"
|
|
3450
|
+
],
|
|
3451
|
+
"signature_motion": "See §15 Motion.",
|
|
3452
|
+
"has_personas": true,
|
|
3453
|
+
"category_raw": "e-commerce"
|
|
3454
|
+
},
|
|
3455
|
+
{
|
|
3456
|
+
"id": "perplexity",
|
|
3457
|
+
"primary_color_hex": "#20808D",
|
|
3458
|
+
"category": "AI",
|
|
3459
|
+
"visual_theme": "Perplexity is an AI answer engine, and its design is built around a single idea: get out of the way of the answer. Where most AI products lean on neon gradients, glassmorphism, and a cold sci-fi chrome, Perplexity went the opposite direction — a calm, editorial, almost Scandinavian aesthetic where the interface dissolves and the text takes the stage. The brand was crafted by studio **Smith & Dicti",
|
|
3460
|
+
"voice_fingerprint": {
|
|
3461
|
+
"register": "clear-confident",
|
|
3462
|
+
"sentence_length": "medium",
|
|
3463
|
+
"metaphor_density": "low",
|
|
3464
|
+
"vocabulary_register": "general-professional"
|
|
3465
|
+
},
|
|
3466
|
+
"tone_keywords": [
|
|
3467
|
+
"clear",
|
|
3468
|
+
"confident",
|
|
3469
|
+
"consistent"
|
|
3470
|
+
],
|
|
3471
|
+
"antipatterns": [
|
|
3472
|
+
"Use Peacock teal (`#20808D`) as the single accent — buttons, links, focus rings, active states",
|
|
3473
|
+
"Background with warm paper tones (`#FBFAF4` / `#FCFCF9`), not pure white",
|
|
3474
|
+
"Use teal-tinted ink (`#091717`) for text, never `#000000`",
|
|
3475
|
+
"Set answer body in FK Grotesk Neue at ~1.6 line-height for a reading experience"
|
|
3476
|
+
],
|
|
3477
|
+
"signature_motion": "*Durations:**",
|
|
3478
|
+
"has_personas": true,
|
|
3479
|
+
"category_raw": "ai"
|
|
3480
|
+
},
|
|
2715
3481
|
{
|
|
2716
3482
|
"id": "piccollage",
|
|
2717
3483
|
"primary_color_hex": "#4FC3C4",
|
|
@@ -2781,6 +3547,58 @@
|
|
|
2781
3547
|
"has_personas": false,
|
|
2782
3548
|
"category_raw": "consumer"
|
|
2783
3549
|
},
|
|
3550
|
+
{
|
|
3551
|
+
"id": "pixiv",
|
|
3552
|
+
"primary_color_hex": "#0096fa",
|
|
3553
|
+
"category": "Consumer",
|
|
3554
|
+
"visual_theme": "pixiv is Japan's largest illustration and creative-work community — a place where millions of artists upload, tag, browse, and bookmark original and fan art. The interface exists to do one thing extraordinarily well: get vivid, full-bleed artwork in front of the viewer's eyes with as little chrome as possible. The product feels like a gallery wall, not a dashboard. The canvas is a near-white surfa",
|
|
3555
|
+
"voice_fingerprint": {
|
|
3556
|
+
"register": "approachable",
|
|
3557
|
+
"sentence_length": "medium",
|
|
3558
|
+
"metaphor_density": "medium",
|
|
3559
|
+
"vocabulary_register": "general-professional"
|
|
3560
|
+
},
|
|
3561
|
+
"tone_keywords": [
|
|
3562
|
+
"clear",
|
|
3563
|
+
"confident",
|
|
3564
|
+
"consistent"
|
|
3565
|
+
],
|
|
3566
|
+
"antipatterns": [
|
|
3567
|
+
"Use pixiv Blue (`#0096fa`) for all navigation, links, and primary CTAs",
|
|
3568
|
+
"Reserve pixiv Red (`#ff4060`) for the bookmark heart and engagement signals",
|
|
3569
|
+
"Keep UI chrome neutral grey so artwork supplies the color",
|
|
3570
|
+
"Use the system-font stack with JP faces (Hiragino, Yu Gothic, Noto Sans JP)"
|
|
3571
|
+
],
|
|
3572
|
+
"signature_motion": "*Durations** (named):",
|
|
3573
|
+
"has_personas": true,
|
|
3574
|
+
"category_raw": "consumer-tech"
|
|
3575
|
+
},
|
|
3576
|
+
{
|
|
3577
|
+
"id": "pixnet",
|
|
3578
|
+
"primary_color_hex": "#ff7200",
|
|
3579
|
+
"category": "content",
|
|
3580
|
+
"visual_theme": "PIXNET (痞客邦) is Taiwan's largest home-grown blogging and content platform, and its design reads exactly like what it is — a warm, editorial, reader-first publishing home rather than a slick venture-funded app. The live homepage opens on a clean white canvas (`",
|
|
3581
|
+
"voice_fingerprint": {
|
|
3582
|
+
"register": "friendly, creator-community",
|
|
3583
|
+
"sentence_length": "medium declarative",
|
|
3584
|
+
"metaphor_density": "low",
|
|
3585
|
+
"vocabulary_register": "brand-appropriate"
|
|
3586
|
+
},
|
|
3587
|
+
"tone_keywords": [
|
|
3588
|
+
"warm",
|
|
3589
|
+
"community",
|
|
3590
|
+
"approachable",
|
|
3591
|
+
"content-led",
|
|
3592
|
+
"lively"
|
|
3593
|
+
],
|
|
3594
|
+
"antipatterns": [
|
|
3595
|
+
"austere",
|
|
3596
|
+
"enterprise"
|
|
3597
|
+
],
|
|
3598
|
+
"signature_motion": "See §15 Motion.",
|
|
3599
|
+
"has_personas": true,
|
|
3600
|
+
"category_raw": "content"
|
|
3601
|
+
},
|
|
2784
3602
|
{
|
|
2785
3603
|
"id": "posthog",
|
|
2786
3604
|
"primary_color_hex": "#F54E00",
|
|
@@ -2860,9 +3678,61 @@
|
|
|
2860
3678
|
"Unlock premium features",
|
|
2861
3679
|
"next-generation AI"
|
|
2862
3680
|
],
|
|
2863
|
-
"signature_motion": "Step-by-step solution reveal fades each numbered step in with an 8px upward translate at 80ms intervals, ending with a soft green checkmark scale-spring.",
|
|
3681
|
+
"signature_motion": "Step-by-step solution reveal fades each numbered step in with an 8px upward translate at 80ms intervals, ending with a soft green checkmark scale-spring.",
|
|
3682
|
+
"has_personas": true,
|
|
3683
|
+
"category_raw": "edutech / AI math solver"
|
|
3684
|
+
},
|
|
3685
|
+
{
|
|
3686
|
+
"id": "ragic",
|
|
3687
|
+
"primary_color_hex": "#f70e0e",
|
|
3688
|
+
"category": "productivity",
|
|
3689
|
+
"visual_theme": "Ragic's website is unapologetically utilitarian -- the visual language of a tool built by spreadsheet people, for spreadsheet people. It is a no-code database SaaS out of Taiwan, and the site wears that engineering pragmatism on its sleeve: a clean white canva",
|
|
3690
|
+
"voice_fingerprint": {
|
|
3691
|
+
"register": "matter-of-fact, no-code/database",
|
|
3692
|
+
"sentence_length": "medium declarative",
|
|
3693
|
+
"metaphor_density": "low",
|
|
3694
|
+
"vocabulary_register": "brand-appropriate"
|
|
3695
|
+
},
|
|
3696
|
+
"tone_keywords": [
|
|
3697
|
+
"utilitarian",
|
|
3698
|
+
"practical",
|
|
3699
|
+
"no-frills",
|
|
3700
|
+
"dense",
|
|
3701
|
+
"functional"
|
|
3702
|
+
],
|
|
3703
|
+
"antipatterns": [
|
|
3704
|
+
"decorative",
|
|
3705
|
+
"airy"
|
|
3706
|
+
],
|
|
3707
|
+
"signature_motion": "See §15 Motion.",
|
|
3708
|
+
"has_personas": true,
|
|
3709
|
+
"category_raw": "productivity"
|
|
3710
|
+
},
|
|
3711
|
+
{
|
|
3712
|
+
"id": "ramp",
|
|
3713
|
+
"primary_color_hex": "#E5FE54",
|
|
3714
|
+
"category": "Fintech",
|
|
3715
|
+
"visual_theme": "Ramp is the corporate-card and spend-management platform that made expense software feel like a premium productivity tool rather than an accounting chore. The brand's entire visual thesis is built on one audacious contrast: a near-black ink (`#1C1B17`) set against an electric lime-yellow (`#E5FE54`) so saturated it almost vibrates. This is not the cautious navy-and-grey of legacy fintech. It's con",
|
|
3716
|
+
"voice_fingerprint": {
|
|
3717
|
+
"register": "b2b-confident",
|
|
3718
|
+
"sentence_length": "medium",
|
|
3719
|
+
"metaphor_density": "low",
|
|
3720
|
+
"vocabulary_register": "finance-professional"
|
|
3721
|
+
},
|
|
3722
|
+
"tone_keywords": [
|
|
3723
|
+
"clear",
|
|
3724
|
+
"confident",
|
|
3725
|
+
"consistent"
|
|
3726
|
+
],
|
|
3727
|
+
"antipatterns": [
|
|
3728
|
+
"Use lime `#E5FE54` only for primary CTAs and savings/value signals — keep it rare and intentional",
|
|
3729
|
+
"Pair lime fills with ink `#1C1B17` text, never white text (contrast + brand consistency)",
|
|
3730
|
+
"Use ink `#1C1B17` (warm near-black), never pure `#000000`, for text and dark surfaces",
|
|
3731
|
+
"Pair Burgess serif headlines with Lausanne sans body for editorial gravitas"
|
|
3732
|
+
],
|
|
3733
|
+
"signature_motion": "*Durations:**",
|
|
2864
3734
|
"has_personas": true,
|
|
2865
|
-
"category_raw": "
|
|
3735
|
+
"category_raw": "fintech"
|
|
2866
3736
|
},
|
|
2867
3737
|
{
|
|
2868
3738
|
"id": "rayark",
|
|
@@ -3004,6 +3874,32 @@
|
|
|
3004
3874
|
"has_personas": false,
|
|
3005
3875
|
"category_raw": "technical"
|
|
3006
3876
|
},
|
|
3877
|
+
{
|
|
3878
|
+
"id": "retool",
|
|
3879
|
+
"primary_color_hex": "#3C3C3C",
|
|
3880
|
+
"category": "Developer Tools",
|
|
3881
|
+
"visual_theme": "Retool is the platform for building internal tools fast — the admin panels, dashboards, and operational apps that companies used to hand-code for months. Its visual identity is unapologetically built *for developers*, and that audience defines everything: the brand site reads like a well-organized IDE, not a consumer landing page. The dominant atmosphere is **dark, structural, and instrumented** —",
|
|
3882
|
+
"voice_fingerprint": {
|
|
3883
|
+
"register": "technical-precise",
|
|
3884
|
+
"sentence_length": "medium",
|
|
3885
|
+
"metaphor_density": "low",
|
|
3886
|
+
"vocabulary_register": "developer"
|
|
3887
|
+
},
|
|
3888
|
+
"tone_keywords": [
|
|
3889
|
+
"clear",
|
|
3890
|
+
"confident",
|
|
3891
|
+
"consistent"
|
|
3892
|
+
],
|
|
3893
|
+
"antipatterns": [
|
|
3894
|
+
"Default to the dark canvas (`#1A1A1A`) for product/tool surfaces; use Green White (`#E9EBDF`) for marketing/light",
|
|
3895
|
+
"Spend Burnt Sienna (`#E0613A`) sparingly — one accented action per view",
|
|
3896
|
+
"Render *values* (IDs, results, env vars, table data) in IBM Plex Mono; render *labels* in Inter",
|
|
3897
|
+
"Use tabular numerals in every table and metric"
|
|
3898
|
+
],
|
|
3899
|
+
"signature_motion": "*Durations** (named):",
|
|
3900
|
+
"has_personas": true,
|
|
3901
|
+
"category_raw": "developer-tools"
|
|
3902
|
+
},
|
|
3007
3903
|
{
|
|
3008
3904
|
"id": "revolut",
|
|
3009
3905
|
"primary_color_hex": "#191c1f",
|
|
@@ -3024,6 +3920,32 @@
|
|
|
3024
3920
|
"has_personas": false,
|
|
3025
3921
|
"category_raw": "enterprise"
|
|
3026
3922
|
},
|
|
3923
|
+
{
|
|
3924
|
+
"id": "richart",
|
|
3925
|
+
"primary_color_hex": "#17b6c9",
|
|
3926
|
+
"category": "fintech",
|
|
3927
|
+
"visual_theme": "Richart -- the digital-banking brand of Taiwan's Taishin International Bank (台新銀行) -- presents itself as the friendliest, most playful face of consumer finance on the Taiwanese web. Its self-declared promise, baked into the page `<title>`, is *\"最能幫年輕人存到錢的銀行\"* ",
|
|
3928
|
+
"voice_fingerprint": {
|
|
3929
|
+
"register": "casual, encouraging, youth-banking",
|
|
3930
|
+
"sentence_length": "medium declarative",
|
|
3931
|
+
"metaphor_density": "low",
|
|
3932
|
+
"vocabulary_register": "brand-appropriate"
|
|
3933
|
+
},
|
|
3934
|
+
"tone_keywords": [
|
|
3935
|
+
"playful",
|
|
3936
|
+
"youthful",
|
|
3937
|
+
"friendly",
|
|
3938
|
+
"approachable",
|
|
3939
|
+
"vivid"
|
|
3940
|
+
],
|
|
3941
|
+
"antipatterns": [
|
|
3942
|
+
"stuffy",
|
|
3943
|
+
"corporate-cold"
|
|
3944
|
+
],
|
|
3945
|
+
"signature_motion": "See §15 Motion.",
|
|
3946
|
+
"has_personas": true,
|
|
3947
|
+
"category_raw": "fintech"
|
|
3948
|
+
},
|
|
3027
3949
|
{
|
|
3028
3950
|
"id": "ridi",
|
|
3029
3951
|
"primary_color_hex": "#3D3D3D",
|
|
@@ -3084,6 +4006,32 @@
|
|
|
3084
4006
|
"has_personas": true,
|
|
3085
4007
|
"category_raw": "education"
|
|
3086
4008
|
},
|
|
4009
|
+
{
|
|
4010
|
+
"id": "robinhood",
|
|
4011
|
+
"primary_color_hex": "#00C805",
|
|
4012
|
+
"category": "Fintech",
|
|
4013
|
+
"visual_theme": "Robinhood is the American brokerage that turned investing from a gated, mahogany-paneled ritual into something that looks and feels like a consumer app. The brand's visual signature is a single, electric act of defiance: **Robinhood Green (`#00C805`)** — a bright, almost radioactive green that exists nowhere in legacy finance. Where incumbents (Fidelity green, Schwab blue, Vanguard maroon) chose c",
|
|
4014
|
+
"voice_fingerprint": {
|
|
4015
|
+
"register": "b2b-confident",
|
|
4016
|
+
"sentence_length": "medium",
|
|
4017
|
+
"metaphor_density": "low",
|
|
4018
|
+
"vocabulary_register": "finance-professional"
|
|
4019
|
+
},
|
|
4020
|
+
"tone_keywords": [
|
|
4021
|
+
"clear",
|
|
4022
|
+
"confident",
|
|
4023
|
+
"consistent"
|
|
4024
|
+
],
|
|
4025
|
+
"antipatterns": [
|
|
4026
|
+
"Use Robinhood Green (`#00C805`) for the single most important action on a screen",
|
|
4027
|
+
"Put dark text (`#0E0E0E`) on green buttons — never white, which fails contrast",
|
|
4028
|
+
"Use tabular/mono figures for all prices, percentages, and portfolio values",
|
|
4029
|
+
"Let green appear against dark (`#0E0E0E`) where it reads most electric"
|
|
4030
|
+
],
|
|
4031
|
+
"signature_motion": "*Durations** (named, not raw milliseconds):",
|
|
4032
|
+
"has_personas": true,
|
|
4033
|
+
"category_raw": "fintech"
|
|
4034
|
+
},
|
|
3087
4035
|
{
|
|
3088
4036
|
"id": "runwayml",
|
|
3089
4037
|
"primary_color_hex": "#000000",
|
|
@@ -3126,6 +4074,32 @@
|
|
|
3126
4074
|
"has_personas": false,
|
|
3127
4075
|
"category_raw": "technical"
|
|
3128
4076
|
},
|
|
4077
|
+
{
|
|
4078
|
+
"id": "sansan",
|
|
4079
|
+
"primary_color_hex": "#E60012",
|
|
4080
|
+
"category": "Productivity",
|
|
4081
|
+
"visual_theme": "Sansan is Japan's category-defining B2B \"business card\" cloud — the company that turned the ritual exchange of *meishi* into a structured, searchable contact graph and grew it into a sales-intelligence platform. The brand wears that heritage as a single, unmistakable mark: a clean white canvas (`#ffffff`) carrying near-black corporate text (`#1a1a1a`) interrupted by one decisive stroke of **Sansan",
|
|
4082
|
+
"voice_fingerprint": {
|
|
4083
|
+
"register": "b2b-confident",
|
|
4084
|
+
"sentence_length": "medium",
|
|
4085
|
+
"metaphor_density": "low",
|
|
4086
|
+
"vocabulary_register": "general-professional"
|
|
4087
|
+
},
|
|
4088
|
+
"tone_keywords": [
|
|
4089
|
+
"clear",
|
|
4090
|
+
"confident",
|
|
4091
|
+
"consistent"
|
|
4092
|
+
],
|
|
4093
|
+
"antipatterns": [
|
|
4094
|
+
"Use Sansan Red (`#E60012`) for the single primary CTA and links — the \"red thread\"",
|
|
4095
|
+
"Keep the canvas white-dominant with `#1a1a1a` corporate text",
|
|
4096
|
+
"Apply the Hiragino / Noto Sans JP / Helvetica Neue stack with JP-aware line-height (1.7+)",
|
|
4097
|
+
"Keep border-radius small (4–8px) for a precise, corporate feel"
|
|
4098
|
+
],
|
|
4099
|
+
"signature_motion": "*Durations:**",
|
|
4100
|
+
"has_personas": true,
|
|
4101
|
+
"category_raw": "productivity"
|
|
4102
|
+
},
|
|
3129
4103
|
{
|
|
3130
4104
|
"id": "sendbird",
|
|
3131
4105
|
"primary_color_hex": "#742DDD",
|
|
@@ -3176,6 +4150,82 @@
|
|
|
3176
4150
|
"has_personas": false,
|
|
3177
4151
|
"category_raw": "developer-tools"
|
|
3178
4152
|
},
|
|
4153
|
+
{
|
|
4154
|
+
"id": "shinhancard",
|
|
4155
|
+
"primary_color_hex": "#005df9",
|
|
4156
|
+
"category": "fintech",
|
|
4157
|
+
"visual_theme": "Shinhan Card's website reads as the digital face of a major Korean financial institution that has been deliberately modernized for a mobile-first, super-app era. The page opens on a clean white canvas (`#ffffff`) layered with soft off-white and pale-blue surfa",
|
|
4158
|
+
"voice_fingerprint": {
|
|
4159
|
+
"register": "formal card/finance",
|
|
4160
|
+
"sentence_length": "medium declarative",
|
|
4161
|
+
"metaphor_density": "low",
|
|
4162
|
+
"vocabulary_register": "brand-appropriate"
|
|
4163
|
+
},
|
|
4164
|
+
"tone_keywords": [
|
|
4165
|
+
"trustworthy",
|
|
4166
|
+
"institutional",
|
|
4167
|
+
"stable",
|
|
4168
|
+
"premium"
|
|
4169
|
+
],
|
|
4170
|
+
"antipatterns": [
|
|
4171
|
+
"playful"
|
|
4172
|
+
],
|
|
4173
|
+
"signature_motion": "See §15 Motion.",
|
|
4174
|
+
"has_personas": true,
|
|
4175
|
+
"category_raw": "fintech"
|
|
4176
|
+
},
|
|
4177
|
+
{
|
|
4178
|
+
"id": "shopline",
|
|
4179
|
+
"primary_color_hex": "#356dff",
|
|
4180
|
+
"category": "e-commerce",
|
|
4181
|
+
"visual_theme": "SHOPLINE presents itself as a bright, optimistic, merchant-friendly commerce platform built for the Taiwan and Hong Kong markets — its homepage opens on a clean white canvas (`#ffffff`) with a confident, saturated royal blue (`#356dff`) doing almost all of the",
|
|
4182
|
+
"voice_fingerprint": {
|
|
4183
|
+
"register": "professional, commerce SaaS",
|
|
4184
|
+
"sentence_length": "medium declarative",
|
|
4185
|
+
"metaphor_density": "low",
|
|
4186
|
+
"vocabulary_register": "brand-appropriate"
|
|
4187
|
+
},
|
|
4188
|
+
"tone_keywords": [
|
|
4189
|
+
"clean",
|
|
4190
|
+
"commerce-first",
|
|
4191
|
+
"confident",
|
|
4192
|
+
"modern",
|
|
4193
|
+
"scalable"
|
|
4194
|
+
],
|
|
4195
|
+
"antipatterns": [
|
|
4196
|
+
"cluttered",
|
|
4197
|
+
"playful"
|
|
4198
|
+
],
|
|
4199
|
+
"signature_motion": "See §15 Motion.",
|
|
4200
|
+
"has_personas": true,
|
|
4201
|
+
"category_raw": "e-commerce"
|
|
4202
|
+
},
|
|
4203
|
+
{
|
|
4204
|
+
"id": "slack",
|
|
4205
|
+
"primary_color_hex": "#4A154B",
|
|
4206
|
+
"category": "Productivity",
|
|
4207
|
+
"visual_theme": "Slack is the work-messaging app that made enterprise software feel human. Where legacy collaboration tools shouted in cold corporate blues and grays, Slack leads with **Aubergine** (`#4A154B`) — a deep, warm eggplant purple that is unmistakably its own. It reads as serious-but-friendly: confident enough for a Fortune 500 IT department, warm enough that you don't dread opening it on a Monday. The a",
|
|
4208
|
+
"voice_fingerprint": {
|
|
4209
|
+
"register": "b2b-confident",
|
|
4210
|
+
"sentence_length": "medium",
|
|
4211
|
+
"metaphor_density": "low",
|
|
4212
|
+
"vocabulary_register": "general-professional"
|
|
4213
|
+
},
|
|
4214
|
+
"tone_keywords": [
|
|
4215
|
+
"clear",
|
|
4216
|
+
"confident",
|
|
4217
|
+
"consistent"
|
|
4218
|
+
],
|
|
4219
|
+
"antipatterns": [
|
|
4220
|
+
"Use Aubergine (`#4A154B`) for brand chrome — sidebar, nav, identity surfaces",
|
|
4221
|
+
"Use Green CTA (`#007A5A`) for the primary action; it pops against aubergine",
|
|
4222
|
+
"Use Lato in the product UI; Larsseit for marketing headlines",
|
|
4223
|
+
"Keep border-radius at 4px for buttons/inputs, 8px for cards/modals"
|
|
4224
|
+
],
|
|
4225
|
+
"signature_motion": "*Durations:**",
|
|
4226
|
+
"has_personas": true,
|
|
4227
|
+
"category_raw": "productivity"
|
|
4228
|
+
},
|
|
3179
4229
|
{
|
|
3180
4230
|
"id": "smarthr",
|
|
3181
4231
|
"primary_color_hex": "#00C4CC",
|
|
@@ -3265,6 +4315,30 @@
|
|
|
3265
4315
|
"has_personas": true,
|
|
3266
4316
|
"category_raw": "Mobility / Car-Sharing (SOCAR Blue approximation — exact hex unpublished)"
|
|
3267
4317
|
},
|
|
4318
|
+
{
|
|
4319
|
+
"id": "soomgo",
|
|
4320
|
+
"primary_color_hex": "#693bf2",
|
|
4321
|
+
"category": "consumer-tech",
|
|
4322
|
+
"visual_theme": "Soomgo (숨고) is Korea's leading local-service and pro marketplace — the place where a homeowner finds a moving-cleaning crew, a tutor, a tax accountant, or a wedding photographer — and its design reflects exactly that mandate: get a stranger to trust a stranger",
|
|
4323
|
+
"voice_fingerprint": {
|
|
4324
|
+
"register": "helpful local-service marketplace",
|
|
4325
|
+
"sentence_length": "medium declarative",
|
|
4326
|
+
"metaphor_density": "low",
|
|
4327
|
+
"vocabulary_register": "brand-appropriate"
|
|
4328
|
+
},
|
|
4329
|
+
"tone_keywords": [
|
|
4330
|
+
"friendly",
|
|
4331
|
+
"practical",
|
|
4332
|
+
"trustworthy",
|
|
4333
|
+
"approachable"
|
|
4334
|
+
],
|
|
4335
|
+
"antipatterns": [
|
|
4336
|
+
"corporate-cold"
|
|
4337
|
+
],
|
|
4338
|
+
"signature_motion": "See §15 Motion.",
|
|
4339
|
+
"has_personas": true,
|
|
4340
|
+
"category_raw": "consumer-tech"
|
|
4341
|
+
},
|
|
3268
4342
|
{
|
|
3269
4343
|
"id": "spacex",
|
|
3270
4344
|
"primary_color_hex": "#f0f0fa",
|
|
@@ -3336,6 +4410,32 @@
|
|
|
3336
4410
|
"has_personas": false,
|
|
3337
4411
|
"category_raw": "consumer-media"
|
|
3338
4412
|
},
|
|
4413
|
+
{
|
|
4414
|
+
"id": "starbucks",
|
|
4415
|
+
"primary_color_hex": "#00704A",
|
|
4416
|
+
"category": "Consumer",
|
|
4417
|
+
"visual_theme": "Starbucks is the world's most recognizable coffee brand, and its digital surfaces translate the warmth of a \"third place\" — neither home nor work — into a calm, generous, premium-feeling interface. The defining gesture is the **House Green (`#00704A`)**: a deep, confident emerald that has become so iconic it functions as a category-defining color the way Tiffany blue defines luxury jewelry. It is ",
|
|
4418
|
+
"voice_fingerprint": {
|
|
4419
|
+
"register": "approachable",
|
|
4420
|
+
"sentence_length": "medium",
|
|
4421
|
+
"metaphor_density": "medium",
|
|
4422
|
+
"vocabulary_register": "general-professional"
|
|
4423
|
+
},
|
|
4424
|
+
"tone_keywords": [
|
|
4425
|
+
"clear",
|
|
4426
|
+
"confident",
|
|
4427
|
+
"consistent"
|
|
4428
|
+
],
|
|
4429
|
+
"antipatterns": [
|
|
4430
|
+
"Use House Green (`#00704a`) as the singular primary action and brand color",
|
|
4431
|
+
"Use fully-rounded pill buttons (`border-radius: 9999px`) — it is the signature shape",
|
|
4432
|
+
"Use warm off-white backgrounds (`#f1f8f4`, `#fafafa`) instead of clinical pure white",
|
|
4433
|
+
"Let large, appetizing photography lead the layout; let copy live in negative space"
|
|
4434
|
+
],
|
|
4435
|
+
"signature_motion": "*Durations** (named):",
|
|
4436
|
+
"has_personas": true,
|
|
4437
|
+
"category_raw": "consumer-tech"
|
|
4438
|
+
},
|
|
3339
4439
|
{
|
|
3340
4440
|
"id": "stripe",
|
|
3341
4441
|
"primary_color_hex": "#533afd",
|
|
@@ -3361,6 +4461,32 @@
|
|
|
3361
4461
|
"has_personas": true,
|
|
3362
4462
|
"category_raw": "fintech"
|
|
3363
4463
|
},
|
|
4464
|
+
{
|
|
4465
|
+
"id": "studio",
|
|
4466
|
+
"primary_color_hex": "#007cff",
|
|
4467
|
+
"category": "Design",
|
|
4468
|
+
"visual_theme": "Studio is a no-code web design tool built for designers who refuse to compromise on craft. Its marketing site is the product's strongest argument: a near-monochrome, gallery-grade canvas where the work — beautiful portfolios, landing pages, agency sites — is the only color on the page. The atmosphere is that of a white-walled Tokyo design studio: pure white surfaces (`#ffffff`), barely-there off-w",
|
|
4469
|
+
"voice_fingerprint": {
|
|
4470
|
+
"register": "crafted-confident",
|
|
4471
|
+
"sentence_length": "medium",
|
|
4472
|
+
"metaphor_density": "low",
|
|
4473
|
+
"vocabulary_register": "general-professional"
|
|
4474
|
+
},
|
|
4475
|
+
"tone_keywords": [
|
|
4476
|
+
"clear",
|
|
4477
|
+
"confident",
|
|
4478
|
+
"consistent"
|
|
4479
|
+
],
|
|
4480
|
+
"antipatterns": [
|
|
4481
|
+
"Keep the interface monochrome — white, off-white `#f7f7f7`, and the grey ramp do the structural work.",
|
|
4482
|
+
"Use `#007cff` only for links and interactive accents; let it stay rare and meaningful.",
|
|
4483
|
+
"Reserve coral `#f84f65` strictly for errors and destructive feedback.",
|
|
4484
|
+
"Use Inter at 400/500/600; build hierarchy from grey value and size, not heavy weights."
|
|
4485
|
+
],
|
|
4486
|
+
"signature_motion": "*Durations:**",
|
|
4487
|
+
"has_personas": true,
|
|
4488
|
+
"category_raw": "design-tools"
|
|
4489
|
+
},
|
|
3364
4490
|
{
|
|
3365
4491
|
"id": "supabase",
|
|
3366
4492
|
"primary_color_hex": "#3ecf8e",
|
|
@@ -3402,6 +4528,32 @@
|
|
|
3402
4528
|
"has_personas": false,
|
|
3403
4529
|
"category_raw": "productivity"
|
|
3404
4530
|
},
|
|
4531
|
+
{
|
|
4532
|
+
"id": "surveycake",
|
|
4533
|
+
"primary_color_hex": "#3dba90",
|
|
4534
|
+
"category": "productivity",
|
|
4535
|
+
"visual_theme": "SurveyCake's marketing site is a study in calm, trustworthy SaaS clarity built for the Taiwanese enterprise market. The page opens on a pure white canvas (`#ffffff`) with dark-charcoal headings (`#3e3e3e`) and a single, decisive mint-green brand color (`#3dba9",
|
|
4536
|
+
"voice_fingerprint": {
|
|
4537
|
+
"register": "product-marketing, practical SaaS",
|
|
4538
|
+
"sentence_length": "medium declarative",
|
|
4539
|
+
"metaphor_density": "low",
|
|
4540
|
+
"vocabulary_register": "brand-appropriate"
|
|
4541
|
+
},
|
|
4542
|
+
"tone_keywords": [
|
|
4543
|
+
"clear",
|
|
4544
|
+
"helpful",
|
|
4545
|
+
"polished",
|
|
4546
|
+
"productive",
|
|
4547
|
+
"approachable"
|
|
4548
|
+
],
|
|
4549
|
+
"antipatterns": [
|
|
4550
|
+
"heavy",
|
|
4551
|
+
"corporate-cold"
|
|
4552
|
+
],
|
|
4553
|
+
"signature_motion": "See §15 Motion.",
|
|
4554
|
+
"has_personas": true,
|
|
4555
|
+
"category_raw": "productivity"
|
|
4556
|
+
},
|
|
3405
4557
|
{
|
|
3406
4558
|
"id": "tada",
|
|
3407
4559
|
"primary_color_hex": "#1EC59F",
|
|
@@ -3454,6 +4606,32 @@
|
|
|
3454
4606
|
"has_personas": false,
|
|
3455
4607
|
"category_raw": "automotive"
|
|
3456
4608
|
},
|
|
4609
|
+
{
|
|
4610
|
+
"id": "theverge",
|
|
4611
|
+
"primary_color_hex": "#5200ff",
|
|
4612
|
+
"category": "Media",
|
|
4613
|
+
"visual_theme": "The Verge is Vox Media's flagship technology publication, and its 2022 in-house redesign is one of the most aggressively opinionated editorial identities on the modern web. Where most tech-news sites default to a polite white canvas with a blue accent, The Verge does the opposite: it opens on an almost-black canvas (`#131313`) and weaponizes two clashing, hyper-saturated accents — an acid \"jelly m",
|
|
4614
|
+
"voice_fingerprint": {
|
|
4615
|
+
"register": "editorial-bold",
|
|
4616
|
+
"sentence_length": "medium",
|
|
4617
|
+
"metaphor_density": "low",
|
|
4618
|
+
"vocabulary_register": "general-professional"
|
|
4619
|
+
},
|
|
4620
|
+
"tone_keywords": [
|
|
4621
|
+
"clear",
|
|
4622
|
+
"confident",
|
|
4623
|
+
"consistent"
|
|
4624
|
+
],
|
|
4625
|
+
"antipatterns": [
|
|
4626
|
+
"Use `#131313` as the canvas — almost-black, never pure `#000000`",
|
|
4627
|
+
"Pair ultraviolet (`#5200ff`) and mint (`#3cffd0`) as a deliberate high-tension collision",
|
|
4628
|
+
"Set headlines in Mānuka 900 at 60px+ — let type dominate",
|
|
4629
|
+
"Use PolySans Mono UPPERCASE for kickers, tags, and timestamps"
|
|
4630
|
+
],
|
|
4631
|
+
"signature_motion": "*Durations** (named):",
|
|
4632
|
+
"has_personas": true,
|
|
4633
|
+
"category_raw": "marketing"
|
|
4634
|
+
},
|
|
3457
4635
|
{
|
|
3458
4636
|
"id": "together.ai",
|
|
3459
4637
|
"primary_color_hex": "#ef2cc1",
|
|
@@ -3665,6 +4843,58 @@
|
|
|
3665
4843
|
"has_personas": false,
|
|
3666
4844
|
"category_raw": "consumer-mobility"
|
|
3667
4845
|
},
|
|
4846
|
+
{
|
|
4847
|
+
"id": "ubie",
|
|
4848
|
+
"primary_color_hex": "#3959cc",
|
|
4849
|
+
"category": "Healthcare",
|
|
4850
|
+
"visual_theme": "Ubie is a Japanese healthcare-AI company whose products — a consumer symptom-checker (ユビー) and clinical software for hospitals — must do something most health software fails at: feel reassuring to an anxious person and credible to a busy doctor, on the same screen. The interface answers this with a warm, optimistic clinical aesthetic. The canvas is pure white (`#ffffff`), text is a soft near-black",
|
|
4851
|
+
"voice_fingerprint": {
|
|
4852
|
+
"register": "reassuring",
|
|
4853
|
+
"sentence_length": "medium",
|
|
4854
|
+
"metaphor_density": "low",
|
|
4855
|
+
"vocabulary_register": "general-professional"
|
|
4856
|
+
},
|
|
4857
|
+
"tone_keywords": [
|
|
4858
|
+
"clear",
|
|
4859
|
+
"confident",
|
|
4860
|
+
"consistent"
|
|
4861
|
+
],
|
|
4862
|
+
"antipatterns": [
|
|
4863
|
+
"Use Ubie Blue (`#3959cc`) for interaction — links, primary buttons, focus, selection.",
|
|
4864
|
+
"Use Ubie Green (`#27cc91`) for health, success, and positive progress.",
|
|
4865
|
+
"Use warm near-black (`#32353a`) for text, never pure `#000000`.",
|
|
4866
|
+
"Keep body text at 170% line-height for a calm, readable rhythm."
|
|
4867
|
+
],
|
|
4868
|
+
"signature_motion": "*Durations:**",
|
|
4869
|
+
"has_personas": true,
|
|
4870
|
+
"category_raw": "healthcare"
|
|
4871
|
+
},
|
|
4872
|
+
{
|
|
4873
|
+
"id": "uniqlo",
|
|
4874
|
+
"primary_color_hex": "#ed1d24",
|
|
4875
|
+
"category": "Commerce",
|
|
4876
|
+
"visual_theme": "Uniqlo is the global apparel brand of Japan's Fast Retailing, and its design language is the visual translation of one idea: **LifeWear** -- simple, high-quality, everyday clothing \"Made for All.\" The interface mirrors the product philosophy with almost literal fidelity. Where the clothing is engineering disguised as plainness, the website is a precise, gridded, near-monochrome canvas where a sing",
|
|
4877
|
+
"voice_fingerprint": {
|
|
4878
|
+
"register": "lifestyle",
|
|
4879
|
+
"sentence_length": "medium",
|
|
4880
|
+
"metaphor_density": "low",
|
|
4881
|
+
"vocabulary_register": "general-professional"
|
|
4882
|
+
},
|
|
4883
|
+
"tone_keywords": [
|
|
4884
|
+
"clear",
|
|
4885
|
+
"confident",
|
|
4886
|
+
"consistent"
|
|
4887
|
+
],
|
|
4888
|
+
"antipatterns": [
|
|
4889
|
+
"Use Uniqlo Red (`#ed1d24`) only for brand, primary CTA, prices/sale, and errors -- ration it",
|
|
4890
|
+
"Keep the canvas pure white (`#ffffff`) with near-black (`#1a1a1a`) text",
|
|
4891
|
+
"Use hard corners -- radius 0px on images/tags/swatches, max 2px on buttons/inputs",
|
|
4892
|
+
"Make the price a first-class element: 700 weight, tabular numerals, subtitle-sized"
|
|
4893
|
+
],
|
|
4894
|
+
"signature_motion": "*Durations**:",
|
|
4895
|
+
"has_personas": true,
|
|
4896
|
+
"category_raw": "ecommerce"
|
|
4897
|
+
},
|
|
3668
4898
|
{
|
|
3669
4899
|
"id": "upbit",
|
|
3670
4900
|
"primary_color_hex": "#093687",
|
|
@@ -3981,6 +5211,32 @@
|
|
|
3981
5211
|
"has_personas": false,
|
|
3982
5212
|
"category_raw": "saas-tool"
|
|
3983
5213
|
},
|
|
5214
|
+
{
|
|
5215
|
+
"id": "wired",
|
|
5216
|
+
"primary_color_hex": "#000000",
|
|
5217
|
+
"category": "Media",
|
|
5218
|
+
"visual_theme": "WIRED is the magazine of record for how technology shapes culture, the economy, and politics — and its visual identity is an editorial machine first, a website second. The brand reads as **uncompromising black-and-white print logic ported to the screen**: a pure white canvas (`#ffffff`), near-absolute black ink (`#000000`), and a single hot accent — WIRED's signature red — deployed surgically for ",
|
|
5219
|
+
"voice_fingerprint": {
|
|
5220
|
+
"register": "editorial-bold",
|
|
5221
|
+
"sentence_length": "medium",
|
|
5222
|
+
"metaphor_density": "low",
|
|
5223
|
+
"vocabulary_register": "general-professional"
|
|
5224
|
+
},
|
|
5225
|
+
"tone_keywords": [
|
|
5226
|
+
"clear",
|
|
5227
|
+
"confident",
|
|
5228
|
+
"consistent"
|
|
5229
|
+
],
|
|
5230
|
+
"antipatterns": [
|
|
5231
|
+
"Build on pure black-on-white; treat color as a rationed resource",
|
|
5232
|
+
"Use WIRED Red (`#e90c17`) only for links, kickers, flags, and conversion CTAs",
|
|
5233
|
+
"Set headlines in the condensed display face, all-caps-leaning, tight leading",
|
|
5234
|
+
"Set body in the humanist sans at 16–19px with 1.55+ line-height"
|
|
5235
|
+
],
|
|
5236
|
+
"signature_motion": "*Durations:**",
|
|
5237
|
+
"has_personas": true,
|
|
5238
|
+
"category_raw": "marketing"
|
|
5239
|
+
},
|
|
3984
5240
|
{
|
|
3985
5241
|
"id": "wise",
|
|
3986
5242
|
"primary_color_hex": "#9fe870",
|
|
@@ -4144,6 +5400,32 @@
|
|
|
4144
5400
|
"has_personas": true,
|
|
4145
5401
|
"category_raw": "Food Delivery"
|
|
4146
5402
|
},
|
|
5403
|
+
{
|
|
5404
|
+
"id": "yourator",
|
|
5405
|
+
"primary_color_hex": "#0063d1",
|
|
5406
|
+
"category": "consumer-tech",
|
|
5407
|
+
"visual_theme": "Yourator is Taiwan's startup-and-digital-talent job board, and its design reads exactly the way a stylish recruiting product for the tech crowd should: clean, bright, friendly, and quietly confident without ever tipping into corporate stiffness. The page opens",
|
|
5408
|
+
"voice_fingerprint": {
|
|
5409
|
+
"register": "design-forward, startup recruiting",
|
|
5410
|
+
"sentence_length": "medium declarative",
|
|
5411
|
+
"metaphor_density": "low",
|
|
5412
|
+
"vocabulary_register": "brand-appropriate"
|
|
5413
|
+
},
|
|
5414
|
+
"tone_keywords": [
|
|
5415
|
+
"stylish",
|
|
5416
|
+
"modern",
|
|
5417
|
+
"confident",
|
|
5418
|
+
"editorial",
|
|
5419
|
+
"youthful"
|
|
5420
|
+
],
|
|
5421
|
+
"antipatterns": [
|
|
5422
|
+
"corporate-stiff",
|
|
5423
|
+
"dull"
|
|
5424
|
+
],
|
|
5425
|
+
"signature_motion": "See §15 Motion.",
|
|
5426
|
+
"has_personas": true,
|
|
5427
|
+
"category_raw": "consumer-tech"
|
|
5428
|
+
},
|
|
4147
5429
|
{
|
|
4148
5430
|
"id": "zapier",
|
|
4149
5431
|
"primary_color_hex": "#ff4f00",
|
|
@@ -4223,6 +5505,32 @@
|
|
|
4223
5505
|
"signature_motion": "찜 heart: outline → filled brand pink with brief pulse; primary CTA uses pink-400 fill, darkening to pink-450/550 on hover/press.",
|
|
4224
5506
|
"has_personas": true,
|
|
4225
5507
|
"category_raw": "Commerce / Women's Fashion Discovery"
|
|
5508
|
+
},
|
|
5509
|
+
{
|
|
5510
|
+
"id": "zozotown",
|
|
5511
|
+
"primary_color_hex": "#000000",
|
|
5512
|
+
"category": "Commerce",
|
|
5513
|
+
"visual_theme": "ZOZOTOWN is Japan's largest fashion commerce platform — a marketplace of 7,000+ brands operated by ZOZO, Inc. (formerly Start Today). Its design language is uncompromisingly editorial: a near-monochrome system of pure black (`#000000`) and pure white (`#ffffff`) that gets out of the way and lets garment photography carry every screen. Where Western fashion retailers reach for serif elegance or pas",
|
|
5514
|
+
"voice_fingerprint": {
|
|
5515
|
+
"register": "lifestyle",
|
|
5516
|
+
"sentence_length": "medium",
|
|
5517
|
+
"metaphor_density": "low",
|
|
5518
|
+
"vocabulary_register": "general-professional"
|
|
5519
|
+
},
|
|
5520
|
+
"tone_keywords": [
|
|
5521
|
+
"clear",
|
|
5522
|
+
"confident",
|
|
5523
|
+
"consistent"
|
|
5524
|
+
],
|
|
5525
|
+
"antipatterns": [
|
|
5526
|
+
"Keep the canvas black-and-white so garment photography is the only color",
|
|
5527
|
+
"Use `#000000` for primary buttons, headings, and the global header",
|
|
5528
|
+
"Reserve `#e60012` strictly for price, SALE, discount %, and urgency signals",
|
|
5529
|
+
"Use the JP Gothic system stack (Hiragino / Yu Gothic / Noto Sans JP)"
|
|
5530
|
+
],
|
|
5531
|
+
"signature_motion": "*Durations** (named):",
|
|
5532
|
+
"has_personas": true,
|
|
5533
|
+
"category_raw": "ecommerce"
|
|
4226
5534
|
}
|
|
4227
5535
|
]
|
|
4228
5536
|
}
|