Bmw · デザイン DNA

ダークな雰囲気のヒーロー、洗練されたタイポグラフィ、大胆なブルーアクセントを持つプレミアムオートモーティブウェブサイト。

デザイン DNA

ドラマチックな写真を通じて高性能車両を展示するラグジュアリーオートモーティブショールーム。

カラー

#1C69D4Accent

#414141Ink

#ffffffBG

#727171Muted

rgba(65, 65, 65, 0.2)Line

深いチャコールと鮮やかな白を基調とし、アクション用に単一のBMWブルーアクセントで画龍点睛するミニマルパレット。

タイポグラフィ

見出しには軽量級（300）を使用し、エレガントでプレミアムな印象を演出する。 · ボタンテキストには中量級（500）を使用し、明確なCTAの強調を図る。 · 大きなディスプレイタイプには、視覚的な密度を高めるために tightened negative letter-spacing を使用する。 · 本文には快適な読書体験を提供するため、十分な行の高さ（1.5-1.6）を保つ。

余白

4px

8px

12px

16px

24px

32px

48px

64px

96px

8pxグリッドシステムと、余裕のある水平パディング（デスクトップヒーローセクションでは96px）を採用し、呼吸の余地を確保。

サーフェス (角丸 / 影 / 罫線)

控えめなチャコール色（#414141）の細い1pxボーダーを、重いアウトラインなしの微細な区切りとして使用。

レイアウト

左揃えのテキストオーバーレイを持つフルブリードヒーロー画像から、下部の中央揃えのホワイトコンテンツセクションへと遷移。

モーションとインタラクション

インタラクティブ要素上の高速な0.1秒のカラー遷移による、応答性のあるフィードバック。 · コンテンツ表示のための滑らかな0.5秒の不透明度フェードイン。 · 展開可能なナビゲーション要素の、微細な幅と位置の遷移。

テキストリンクとボタン上の即座のカラー変化、画像上の微細な不透明度シフト。 · 重いスケールやトランスフォーム効果なしの、クリーンなステート遷移。

コンポーネント

文体と禁止事項

パック内の実スクリーンショット

Bmw — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

System Prompt

BMW.comは、ドラマチックなフルビューポート写真と、控えめでエレガントなタイポグラフィを組み合わせたプレミアムオートモーティブブランドウェブサイトです。デザインでは、軽量級のグロテスクサンス（bmwTypeNextWeb）を主に軽量級（300）の見出しに使用し、ラグジュアリーな印象を生み出しています。パレットはミニマルで、ホワイト（#FFFFFF）の背景、チャコールインク（#414141）、CTA用の単一のBMWブルーアクセント（#1C69D4）を採用しています。主要なHEXカラーには、ブルーアクセント、ホワイト背景、ダークオーバーレイ用のチャコール（#262626）が含まれます。ヒーローセクションでは、テキストの可読性のためにグラデーションオーバーレイを用いたフルブリードオートモーティブ写真を使用。重要な注意点：ボタンの角丸は絶対に使わない（鋭い/四角のままに）、複数のアクセントカラーは絶対に使わない（ブルーが唯一のクロマティック要素）、見出しに太いフォントウェイトは絶対に使わない（常に軽量/300）。レイアウトは、ドラマチックなダーク写真ヒーローからクリーンなホワイトコンテンツセクションへと遷移します。ナビゲーションは、クリーンな水平リンクとドロップダウンシェブロンを持つミニマルなものです。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック（エージェント用） ↗