# デザイン20パターン（Refero / getdesign.md 参考）

FCオススメ比較くん（fcmatching.com）のUI候補一覧です。  
ギャラリー: [`themes/index.html`](../themes/index.html)

| # | テーマ | 雰囲気 | 本番試用 | 参考 |
|---|--------|--------|----------|------|
| 1 | Stripe | 金融インフラ・indigo | ✅ 本番既定 | [DESIGN.md](https://getdesign.md/stripe/design-md) |
| 2 | Linear | ダーク・紫・精密UI | ✅ | [DESIGN.md](https://getdesign.md/linear.app/design-md) |
| 3 | Notion | 文書アプリ・ブルー | ✅ | [DESIGN.md](https://getdesign.md/notion/design-md) |
| 4 | ElevenLabs | シネマティック・オレンジ | ✅ | [DESIGN.md](https://getdesign.md/elevenlabs/design-md) |
| 5 | Vercel | 黒白＋ブルー | ✅ | [DESIGN.md](https://getdesign.md/vercel/design-md) |
| 6 | Supabase | ダークエメラルド | ✅ `?theme=supabase` | [DESIGN.md](https://getdesign.md/supabase/design-md) |
| 7 | Resend | ミニマルダーク | ✅ | [DESIGN.md](https://getdesign.md/resend/design-md) |
| 8 | PostHog | 分析SaaS・オレンジ | ✅ | [DESIGN.md](https://getdesign.md/posthog/design-md) |
| 9 | Raycast | ランチャー・赤紫 | ✅ | [DESIGN.md](https://getdesign.md/raycast/design-md) |
| 10 | Cal.com | ニュートラル・黒CTA | ✅ | [DESIGN.md](https://getdesign.md/cal/design-md) |
| 11 | Intercom | フレンドリーブルー | ✅ | [DESIGN.md](https://getdesign.md/intercom/design-md) |
| 12 | Figma | クリエイティブ | ✅ | [DESIGN.md](https://getdesign.md/figma/design-md) |
| 13 | Wise | グリーン・フィンテック | ✅ | [DESIGN.md](https://getdesign.md/wise/design-md) |
| 14 | Spotify | ダーク＋グリーン | ✅ | [DESIGN.md](https://getdesign.md/spotify/design-md) |
| 15 | Airbnb | コーラル・旅行 | ✅ | [DESIGN.md](https://getdesign.md/airbnb/design-md) |
| 16 | Claude | テラコッタ | 参考のみ | [DESIGN.md](https://getdesign.md/claude/design-md) |
| 17 | Shopify | ネオングリーン | 参考のみ | [DESIGN.md](https://getdesign.md/shopify/design-md) |
| 18 | Coinbase | ブルー・信頼 | 参考のみ | [DESIGN.md](https://getdesign.md/coinbase/design-md) |
| 19 | Apple | 余白・シネマ | 参考のみ | [DESIGN.md](https://getdesign.md/apple/design-md) |
| 20 | Cursor | IDE・グラデ | 参考のみ | [DESIGN.md](https://getdesign.md/cursor/design-md) |

## 試し方

- ギャラリーから **「本番で試す」** → トップに反映（`localStorage` + `?theme=`）
- 直接 URL: `https://fcmatching.com/?theme=linear`

## 出典

- [Refero Styles](https://styles.refero.design/)
- [awesome-design-md](https://github.com/VoltAgent/awesome-design-md)
- [getdesign.md](https://getdesign.md/)