BMW はドイツのラグジュアリー自動車ブランドで、エンジニアリングの精度そのものがデザイン言語です。UI では BMWTypeNextLatin のウェイト 300、大文字のディスプレイ書体が「静かな権威」を表現し、BMW ブルー（#1c69d4）はインタラクティブな要素にのみ登場します。角丸は一律ゼロ——鋭い直角は工業的な幾何学へのこだわりです。暗色のヒーロー写真と白いコンテンツ領域が交互に並び、ショールームの照明のリズムを再現します。テーマは --site-context-* 変数で駆動します。自動車、ハードウェア、ハイエンド工業ブランドの UI に適しています。
BMW自動車
プロンプトテンプレート
基本テンプレート
Design a BMW-inspired interface. - BMWTypeNextLatin Light (weight 300) uppercase for display — whispered authority; - BMW Blue (#1c69d4) as singular accent — used only for interactive elements; - Zero border-radius detected — angular, sharp-cornered, industrial geometry; - Dark hero photography + white content sections — showroom lighting rhythm; - CSS variable-driven theming: --site-context-* tokens for brand flexibility. Colors: #ffffff, #1c69d4, #0653b6, #262626 with #1c69d4 accent.
バリエーションプロンプト
📱 モバイル
Design a mobile app with BMW aesthetics. Use BMW color identity with #1c69d4 accents. Clean, touch-friendly, native feel.
💻 Web
Design a web application with BMW style. Use BMW color identity with #1c69d4 accents. Professional, responsive layout.
📊 ダッシュボード
Design a dashboard with BMW design language. Use BMW color identity with #1c69d4 accents. Data-rich, organized, clear hierarchy.
📄 ランディングページ
Design a landing page with BMW visual identity. Use BMW color identity with #1c69d4 accents. Compelling, conversion-focused.
使用例
BMW アプリ
WebBuild a web app with BMW design language and #1c69d4 color system.
BMW ダッシュボード
ダッシュボードCreate a dashboard using BMW style with data visualization and modern typography.
✅ 適した用途
- 自動車業界
- 自動車ブランドとコンフィギュレーター
- ハイエンド工業製品ページ
❌ 適さない用途
- 気軽でカジュアルなコンシューマーアプリ
- カラフルな子ども向け UI
DESIGN.md ファイル
design.md オープン形式に準拠したデザインシステム記述。コピーまたはダウンロードして AI コーディングツールに渡せます。