Claude は Anthropic が開発した AI アシスタントで、母体は AI の安全性と研究に取り組む企業です。このスタイルは画面の白ではなく暖かな羊皮紙色の下地（#f5f4ed）を使い、テラコッタ（#c96442）をブランドのアクセントとします。Anthropic の書体ファミリーはセリフ体が見出しを、サンセリフ体が UI を、等幅体がコードを担当し、ニュートラルカラーはすべて黄褐色寄りの暖かな色調です。従来のテック系アイコンの代わりにイラストを用います。AI 製品と長文を読むシーンに適しています。
Claude (Anthropic)AI・大規模モデル
プロンプトテンプレート
基本テンプレート
Design a Claude-inspired interface. - Warm parchment canvas (#f5f4ed) evoking premium paper, not screens; - Custom Anthropic type family: Serif for headlines, Sans for UI, Mono for code; - Terracotta brand accent (#c96442) — warm, earthy, deliberately un-tech; - Exclusively warm-toned neutrals — every gray has a yellow-brown undertone; - Organic, editorial illustrations replacing typical tech iconography. Colors: #141413, #c96442, #d97757, #b53333 with #c96442 accent.
バリエーションプロンプト
📱 モバイル
Design a mobile app with Claude aesthetics. Use Claude color identity with #c96442 accents. Clean, touch-friendly, native feel.
💻 Web
Design a web application with Claude style. Use Claude color identity with #c96442 accents. Professional, responsive layout.
📊 ダッシュボード
Design a dashboard with Claude design language. Use Claude color identity with #c96442 accents. Data-rich, organized, clear hierarchy.
📄 ランディングページ
Design a landing page with Claude visual identity. Use Claude color identity with #c96442 accents. Compelling, conversion-focused.
使用例
Claude（Anthropic）アプリ
WebBuild a web app with Claude design language and #c96442 color system.
Claude（Anthropic）ダッシュボード
ダッシュボードCreate a dashboard using Claude style with data visualization and modern typography.
✅ 適した用途
- AI
- AI アシスタント系プロダクトの会話 UI
- 読書体験を重視するプロダクト紹介
❌ 適さない用途
- 高彩度ネオンのeスポーツ風 UI
- データ密度の高い取引ターミナル
DESIGN.md ファイル
design.md オープン形式に準拠したデザインシステム記述。コピーまたはダウンロードして AI コーディングツールに渡せます。