A curated collection of DESIGN.md files for Japanese web services — enabling AI agents to generate accurate Japanese UI with proper typography, font stacks, and typographic rules.

日本語 | English

DESIGN.md は Google Stitch が提唱するフォーマットで、AIエージェントが一貫したUIを生成するためのデザイン仕様書です。プレーンテキストのMarkdownで記述し、コードベースに AGENTS.md（作り方）と並べて DESIGN.md（見た目と雰囲気）として配置します。

既存の awesome-design-md は欧米の55以上のサービスをカバーしていますが、日本語タイポグラフィの仕様は完全に欠落しています。日本語UIには根本的に異なるタイポグラフィ仕様が必要です：

• 和文フォントのフォールバックチェーン（和文 → 欧文 → generic）
• 広い行間（line-height 1.5〜2.0、欧文の1.4〜1.5とは異なる）
• 日本語の字間（本文に0.04〜0.1em程度）
• 禁則処理（句読点や括弧の行頭・行末ルール）
• OpenType機能（palt, kern によるプロポーショナル組版）
• 混植ルール（和文と欧文の組み合わせ規則）

これらの仕様がなければ、AIエージェントは間違ったフォント、詰まった行間、壊れた句読点処理の日本語UIを生成してしまいます。

各 DESIGN.md のデザイントークンを可視化したショーケースページ（preview.html）を同梱しています。

Gallery (625 sites)

Apple	MUJI	Mercari	STUDIO	SmartHR	freee
note	Novasell	WIRED	Toyota	LINE	Cookpad
MF	Cybozu	Qiita	Rakuten	Tabelog	pixiv
Zenn	connpass	Sansan	Notion	ABEMA	Droga5
三菱地所	Nintendo	UNIQLO	星野リゾート	デジタル庁	PayPay
日経電子版	MOSH	Shiseido	STORES	一休.com	Wantedly
Snow Peak	JINS	ヤマハ	BAKE	nendo	BEAMS
サンリオ	吉田カバン	中川政七商店	POLA	D&DEPARTMENT	Takram
KOKUYO	Gマーク	teamLab	ISSEY MIYAKE	SOU・SOU	PARCO
とらや	IDÉE	Mazda	BRUTUS	ACTUS	KINTO
21_21 DS	Pen Online	LEXUS	マルニ木工	POPEYE	ミナ ペルホネン
NDC	代官山 蔦屋書店	BALMUDA	ほぼ日	±0	サントリー
GINZA SIX	東京ミッドタウン	Casa BRUTUS	AURALEE	Karimoku NS	カキモリ
グランドセイコー	CIBONE	POSTALCO	OSAJI	45R	sacai
AKOMEYA	森美術館	Vermicular	TRUNK(HOTEL)	アマン東京	土屋鞄
HARIO	能作	Aesop	TOMORROWLAND	カルビー	YAECA
CLASKA	DEAN&DELUCA	TRAVELER'S	Dandelion	HIGASHIYA	Soup Stock
1616/arita	THREE	Blue Bottle	HASAMI	Spiral	MARKS&WEB
TODAY'S SPECIAL	cado	SHIRO	TRUCK	IKEUCHI	NOT A HOTEL
HERALBONY	北欧暮らし	cowcamo	FABRIC TOKYO	objcts.io	Goldwin
MOTHERHOUSE	uka	SANU	Francfranc	KEYUCA	Minimal
ORBIS	BOTANIST	KASHIYAMA	TENTIAL	10YC	LUMINE
nanamica	IPSA	YAMAP	COHINA	and wander	SONY	DESCENTE	TOTO
KUON	ReFa	mt	FUJIFILM	UNITED ARROWS	KIRIN	Mizuno	PILOT
SHARP	Panasonic	MIKIMOTO	SAPPORO	LOFT	Canon	SUBARU
博報堂	Cygames	OWNDAYS	LEMNOS	GU	CITIZEN
CFCL	D-BROS	SIGMA	伊藤園	カインズ	カゴメ
KAPITAL	ANREALAGE	KURKKU FIELDS	KOSÉ	CASIO	HOSOO
WACOAL	TIGER	キユーピー	visvim	NEIGHBORHOOD	Afternoon Tea
shu uemura	YOKU MOKU	HUMAN MADE	Notion Dev	ZOZO	CyberAgent	LIFULL	BASE
DAIKIN	Recruit	ATON	Mame Kurogouchi	PRESS BUTTER SAND	RMK	amadana	Oisix
JAL	タイミー	Kyash	Honda	ANA	一保堂茶舗
DECORTÉ	tokyobike	MOONSTAR	TASAKI	COEDO	ITOYA	dentsu
graniph	Fujitsu	Onitsuka Tiger	URBAN RESEARCH	SNIDEL	DAISO	ニトリ	JILL STUART Beauty
NISSAN	Meiji	Roland	BAPE	SHIPS	GANZO
Studio Ghibli	Seiko	Asahi Beer	Nikon	ROYCE'	KEYENCE
Yohji Yamamoto	Wacom	白鳳堂	Shimano	Bridgestone	Yonex
Nissin	HYKE	Komeda	Zoff	LUPICIA	Tabio
Glico	Kao	Morinaga
LIXIL	Ajinomoto	BANDAI NAMCO
LAWSON	青山フラワーマーケット	猿田彦珈琲
NTT Group	伊藤忠商事	住友林業
日立製作所	三井不動産	クボタ
一風堂	ZENB	クラシル	大和ハウス	TOPPAN	AGC
SEGA	積水ハウス	Audio-Technica	NTTドコモ	SAKE HUNDRED	FELISSIMO
MIXI	DeNA	カルピス
WHILL	niko and...	DULTON
GREEN SPOON	HIGHTIDE	LOWYA	Yakult	Brother	ZOJIRUSHI
TAKEO	Sghr	TENERITA	AMBUSH	Clé de Peau	FANCL
SoftBank	KALDI	nano universe
OMRON	SUQQU	ポカリスエット
DASSAI	UNDERCOVER	LUSH
NANGA	KURAND	Time & Style
Hender Scheme	Spiber	ARTS&SCIENCE
SUZUKI	TANITA	ASKUL
LUUP	RAKSUL	Benesse
貝印	一蘭	BAYCREW'S	1LDK	aeru	cotogoto
CAMPFIRE	Creema	Chatwork	Hands	PLST	MOS BURGER
CHOYA	TULLY'S	Kalita	ALBION	Square Enix	ITOKI
mont-bell	CAPCOM	UCC
Kyocera	au	ENEOS
TOKYU	LOTTE	高島屋
KUMON	東京メトロ	Epson
キッコーマン	JR東日本	TOSHIBA
SmartNews	TOMBOW	KING JIM
mybest	Ubie	READYFOR
Plaid	LayerX	Schoo
THE	CLAS	graf	10X	NEWT	天童木工
&Premium	GO	OMO	MOHEIM	TENGA	K5
TYPICA	東京茶寮	DDD HOTEL	AXIS	good design company
DRAFT	茅乃舎	Graphpaper	美術手帖	石巻工房
NOHGA HOTEL	PostCoffee	Ambientec
釜浅商店	東屋	たねや
White Mtn.	Artizon	カンディハウス
Celvoke	Discover Japan	BAUM
CINRA	Loftwork	Subsequence
PUEBCO	Landscape Products	金沢21世紀美術館
ONIBUS COFFEE	暮しの手帖	BIOTOP
オカムラ	飛騨産業
MARKAWARE	SIX	kolor
開化堂	山と道	SIWA｜紙和
DELFONICS	HASUNA	SIRI SIRI
ミナ ペルホネン	KIGI	groovisions
モリサワ	国立新美術館	サンゲツ
東京都現代美術館	金子眼鏡	玉川堂
十和田市現代美術館	東京都写真美術館	コンセント
スマートバンク	根津美術館	中村藤吉本店
9h ナインアワーズ	ポーラ美術館	石見銀山 群言堂
東京都庭園美術館	八海山	カミナシ
諏訪田製作所	final	ぺんてる
うなぎの寝床	にんべん	ミシマ社
大阪中之島美術館	ヤッホーブルーイング	ライゾマティクス
ログラス	麻布台ヒルズ	印傳屋
ANDPAD	Whatever	福光屋
京都市京セラ美術館	丸山珈琲	TRANSIT GENERAL OFFICE
ヌーラボ	大分県立美術館	角川武蔵野ミュージアム
青森県立美術館	文喫	Preferred Networks
フォントワークス	瀬戸内国際芸術祭	Waphyto
三菱鉛筆 uni	Peach Aviation	Hanako
スターフライヤー	dancyu	ロート製薬
MIMIGURI	鶴屋吉信	静嘉堂文庫美術館
YCAM	ココマイスター	Mr. CHEESECAKE
山崎実業	アユーラ	ファクトリエ
ミツカン	UPSIDER	シャトレーゼ
hacomono	SUZURI	食べチョク
Hacoa	GOOD NATURE STATION	TableCheck
ZEBRA	よーじや	サクラクレパス
DNP	有隣堂	帝国ホテル
石屋製菓 ISHIYA	東京国立博物館	nosh
ソラシドエア	森ビル	ヤンマー
ライオン	新潮社	ソメスサドル
丸亀製麺	カリモク家具	白鶴酒造
青幻舎	足立美術館	みんなの銀行
JRA	Nstock	SORANO HOTEL
東京オペラシティ アートギャラリー	Algomatic	ベネッセアートサイト直島
bitFlyer	船橋屋	熊本市現代美術館
Findy	イワタ	玄光社
一条工務店	国立科学博物館	鹿島建設
ＪＲ東海	カオナビ	近畿日本鉄道
京王電鉄	京都国立博物館	九州国立博物館
マルマン	MOA美術館	加島屋
ミサワホーム	奈良国立博物館	ニッカウヰスキー
野村不動産	大林組	及源鋳造
大倉陶園	リノベる。	三陽商会
誠文堂新光社	世田谷美術館	プラチナ万年筆
シロカ	淡交社	丹青社
東急不動産	ウェルスナビ	JR西日本
クラウドサイン	世田谷文学館	南海電気鉄道
オークラ東京	Autify	ダイニー
みすず書房	さくらインターネット	山櫻
高橋工芸	愛知県美術館	ユーグレナ
共同印刷	大橋量器	長崎県美術館
ホテル ザ 三井 京都	成田国際空港	関西国際空港
静岡県立美術館	中外製薬	第一三共
特種東海製紙	ヒューリック	阪急阪神不動産
界	NIPPONIA	MICIN
日本民藝館	大塚製薬	エスビー食品
沖縄県立博物館・美術館	玉乃光酒造	東北新社
東京建物	ビザスク	ツムラ
ヤマキ	アステラス製薬	旭化成
DAIKEN	IHI	カネカ
KDDI	三菱商事	クラレ
協和キリン	三井物産	NXグループ
ニデック	小野薬品工業	野村證券
日本郵船	塩野義製薬	住友化学
島津製作所	シスメックス	武田薬品
東宝	東京ステーションホテル	東洋経済新報社
横浜美術館	アドバンテスト	イオン
アルプスアルパイン	ドトールコーヒー	福田美術館
ハレクラニ沖縄	女子美術大学	熊谷組
関西ペイント	三井ホーム	武蔵野美術大学
森永乳業	日本ハム	ニプロ
西松建設	商船三井	川崎汽船
オリックス	りそなホールディングス	三井住友銀行
国立歴史民俗博物館	住友生命	多摩美術大学
太陽誘電

1. template/DESIGN.md をコピー
2. 各セクションを対象サービスの実際のCSS値で埋める
3. セクションヘッダーは英語のまま（AIエージェントの可読性のため）
4. 値の説明やDo's and Don'tsは日本語で記述

テンプレートは以下の9セクションで構成されています（標準フォーマットを日本語タイポグラフィ向けに拡張）：

1. Visual Theme & Atmosphere — 視覚テーマと雰囲気
2. Color Palette & Roles — カラーパレットと役割
3. Typography Rules — タイポグラフィ（日本語拡張の核心）
   • 3.1 和文フォント
   • 3.2 欧文フォント
   • 3.3 font-family指定（フォールバック込み）
   • 3.4 文字サイズ・ウェイト階層
   • 3.5 行間・字間
   • 3.6 禁則処理・改行ルール
   • 3.7 OpenType機能
   • 3.8 縦書き（該当する場合）
4. Component Stylings — コンポーネントスタイル
5. Layout Principles — レイアウト原則
6. Depth & Elevation — 深度と影
7. Do's and Don'ts — デザインガードレール
8. Responsive Behavior — レスポンシブ挙動
9. Agent Prompt Guide — エージェント向けプロンプトガイド

日本語サービスの DESIGN.md 追加を歓迎します。CONTRIBUTING.md を参照してください。

DESIGN.md is a format introduced by Google Stitch — a plain-text markdown file that AI agents read to generate consistent UI. It sits alongside AGENTS.md (how to build) as DESIGN.md (how it should look and feel).

The existing awesome-design-md covers 55+ Western services but has zero coverage of Japanese typography. Japanese UI requires fundamentally different typographic specifications:

• CJK font-family fallback chains (和文 → 欧文 → generic)
• Higher line-height (1.5–2.0 vs Western 1.4–1.5)
• Japanese letter-spacing (0.04–0.1em for body text)
• Kinsoku shori (禁則処理) — line-break rules for CJK punctuation
• OpenType features (palt, kern) for proportional Japanese typesetting
• Mixed typesetting (混植) — rules for combining Japanese and Latin typefaces

Without these specifications, AI agents produce Japanese UI with broken typography — wrong fonts, cramped line-height, and mishandled punctuation.