Superhuman は「速度」を主眼に置くメールとオフィスのスイートで、現在はどこでも使える AI 生産性ツールへと拡張しています。スタイルはハイプライスな質感の路線を進み、深紫のグラデーションのヒーローエリア（#1b1938）が大きな面積の白い本文と対比し、Super Sans VF は 460〜700 の間の非標準のウェイト段階を使います。見出しの行高は 0.96 まで詰められ、ボタンは高彩度の CTA ではなく控えめな暖かなクリーム色（#e9e5dd）、ラベンダー紫（#cbb7fb）が唯一の柔らかなアクセントです。ハイエンドな効率化ツールに適しています。
Superhuman開発者ツール
プロンプトテンプレート
基本テンプレート
Design a Superhuman-inspired interface. - Deep purple gradient hero (#1b1938) contrasting against a predominantly white content body; - Super Sans VF variable font with non-standard weight stops (460, 540, 600, 700) — sits between conventional weight categories; - Ultra-tight display line-height (0.96) creating compressed, powerful headlines; - Warm Cream (#e9e5dd) buttons instead of bright/saturated CTAs — understated luxury; - Lavender Purple (#cbb7fb) as the singular accent color — a soft, approachable purple. Colors: #1b1938, #cbb7fb, #292827, #714cb6 with #1b1938 accent.
バリエーションプロンプト
📱 モバイル
Design a mobile app with Superhuman aesthetics. Use Superhuman color identity with #1b1938 accents. Clean, touch-friendly, native feel.
💻 Web
Design a web application with Superhuman style. Use Superhuman color identity with #1b1938 accents. Professional, responsive layout.
📊 ダッシュボード
Design a dashboard with Superhuman design language. Use Superhuman color identity with #1b1938 accents. Data-rich, organized, clear hierarchy.
📄 ランディングページ
Design a landing page with Superhuman visual identity. Use Superhuman color identity with #1b1938 accents. Compelling, conversion-focused.
使用例
Superhuman アプリ
WebBuild a web app with Superhuman design language and #1b1938 color system.
Superhuman ダッシュボード
ダッシュボードCreate a dashboard using Superhuman style with data visualization and modern typography.
✅ 適した用途
- 開発者ツール
- メールと効率化のハイエンドツール
- キーボード優先のプロフェッショナル UI
❌ 適さない用途
- タッチ優先のカジュアルアプリ
- ポップで多彩なコンシューマー製品
DESIGN.md ファイル
design.md オープン形式に準拠したデザインシステム記述。コピーまたはダウンロードして AI コーディングツールに渡せます。