Gradient はグラデーションが駆動する UI です。色彩がページ上を連続的に流れ、マゼンタ(#E60076)から紫(#990FFA)への遷移は暮れの空のようです。グラデーションが雰囲気、強調、区切りを担い、静的なレイアウトに動勢を生みます。ブランド公式サイト、クリエイティブプロダクト、「流動感」が必要なビジュアルナラティブに適しています。
Gradient擬態とエフェクト
プロンプトテンプレート
基本テンプレート
Design a Gradient-inspired interface. Colors: #E60076, #16A34A, #D97706, #DC2626 with #E60076 accent. Typography: #990FFA.
バリエーションプロンプト
📱 モバイル
Design a mobile app with Gradient aesthetics. Use Gradient color identity with #E60076 accents. Clean, touch-friendly, native feel.
💻 Web
Design a web application with Gradient style. Use Gradient color identity with #E60076 accents. Professional, responsive layout.
📊 ダッシュボード
Design a dashboard with Gradient design language. Use Gradient color identity with #E60076 accents. Data-rich, organized, clear hierarchy.
📄 ランディングページ
Design a landing page with Gradient visual identity. Use Gradient color identity with #E60076 accents. Compelling, conversion-focused.
使用例
Gradient アプリ
WebBuild a web app with Gradient design language and #E60076 color system.
Gradient ダッシュボード
ダッシュボードCreate a dashboard using Gradient style with data visualization and #990FFA typography.
✅ 適した用途
- ビジュアル効果のシーン
- モダンなプロダクト公式サイト
- クリエイティブなイベントページ
❌ 適さない用途
- ミニマルな白黒のツール
- 厳粛なデータ管理画面
DESIGN.md ファイル
design.md オープン形式に準拠したデザインシステム記述。コピーまたはダウンロードして AI コーディングツールに渡せます。