Shopify はオールインワンの EC プラットフォームで、マーチャントの迅速なサイト構築と運営を支援します。このスタイルはダークを下地に（純黒ではなく森のインクグリーン寄り）、ウェイト 330 の超軽量な見出し書体が 96px のサイズで浮遊感を描きます。ネオングリーン（#36F4A4）が唯一のエネルギーを表すアクセントカラーで、ボタンは全ピル型の角丸、多層シャドウが写真のような奥行きを生みます。EC、SaaS、映画的なファーストビューのナラティブが必要なシーンに適しています。
ShopifyEC と小売
プロンプトテンプレート
基本テンプレート
Design a Shopify-inspired interface. - Dark-first design with deep forest-teal undertones (not pure black); - Ultra-light display typography (weight 330) at monumental scale (96px) creating an ethereal presence; - Neon Green (#36F4A4) as the singular high-energy accent against darkness; - Full-pill buttons (9999px radius) as the primary interactive shape; - Layered, multi-stage box shadows creating photographic depth. Colors: #FFFFFF, #000000, #36F4A4, #C1FBD4 with #36F4A4 accent. Typography: - Background: White (.
バリエーションプロンプト
📱 モバイル
Design a mobile app with Shopify aesthetics. Use Shopify color identity with #36F4A4 accents. Clean, touch-friendly, native feel.
💻 Web
Design a web application with Shopify style. Use Shopify color identity with #36F4A4 accents. Professional, responsive layout.
📊 ダッシュボード
Design a dashboard with Shopify design language. Use Shopify color identity with #36F4A4 accents. Data-rich, organized, clear hierarchy.
📄 ランディングページ
Design a landing page with Shopify visual identity. Use Shopify color identity with #36F4A4 accents. Compelling, conversion-focused.
使用例
Shopify アプリ
WebBuild a web app with Shopify design language and #36F4A4 color system.
Shopify ダッシュボード
ダッシュボードCreate a dashboard using Shopify style with data visualization and - Background: White ( typography.
✅ 適した用途
- EC のシーン
- EC SaaS プラットフォーム
- ダークで映画的なプロダクトページ
❌ 適さない用途
- 紙の出版スタイル
- 静かな読書サイト
DESIGN.md ファイル
design.md オープン形式に準拠したデザインシステム記述。コピーまたはダウンロードして AI コーディングツールに渡せます。