厳選・オープン・無料

Aimé Leon Dore

UI要素よりもシネマティックなエディトリアル写真を優先する、ミニマリストでハイエンドなファッションeコマースサイト。

01

デザイン DNA

プレミアムヘリテージライフスタイルブランドのキュレーションされたギャラリー

02

カラー

深いブラック、クリーンなホワイト、繊細なグレーに依存した、対照的なモノクロパレット。エディトリアル写真のインパクトを最大化します。

03

タイポグラフィ

geometric-sans · neo-grotesque-sans

• display14px · 400
• body14px · 400
• caption10px · 400

ブランドアイデンティティ、ナビゲーション、インタラクティブなラベルに大文字を多用 · プレミアムな質感のために、すべてのテキストサイズに広めのトラッキングを適用 · クリーンで広めに設定されたタイポグラフィとフルブリード写真の組み合わせ

04

余白

モーダルとヘッダー内に十分な余白を確保する、厳格なスペーシングシステム。

05

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

入力フィールド、ボタン、メニューディバイダーなど、個々の要素を分離するためにのみ使用される、極めて最小限のボーダー。

06

レイアウト

中央に固定されたヘッダーオーバーレイを備えた、没入型のフルブリード写真。大型のクリーンな長方形モーダルが間隔を設けて表示されます。

07

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

モーダルの出現に対する滑らかなフェードとトランジション · セカンダリUI要素に対するリニアなスライディングアニメーション

インタラクティブなテキストやアイコンに対する、繊細な不透明度の変化やシンプルな色の反転。 · クリーンな状態変化による、即座のフィードバック。

08

コンポーネント

• button プライマリアクションにはソリッドブラックの塗りつぶし、セカンダリアクションにはブラックボーダー付きのクリーンなホワイト背景を持つ、クリーンな長方形ボタン。
• card プライマリビューには表示されませんが、エディトリアルスタイルに基づき、グリッドベースでボーダーレスであることが示唆されます。
• chip 存在しません。
• input シンプルな、下線のみの入力フィールド。
• hero ブランド名と最小限のナビゲーションアイコンを備えた固定ヘッダーオーバーレイを持つ、フルブリードのシネマティックビデオまたは写真ヒーロー。

09

文体と禁止事項

• トーン 洗練され、プレミアムで、意図的に控えめ。
• 見出し 大文字で、トラッキングを広げ、簡潔で、非常に構造化されている。
• CTA 直接的、大文字で、機能的に明確。

• 角丸を使用しない — スクリーンショットではボタンやモーダルなどのシャープな長方形UI要素が示されています
• カラフルなアクセントを追加しない — スクリーンショットでは厳格にモノクロでニュートラルなパレットが示されています
• 重いドロップシャドウを使用しない — スクリーンショットでは平坦でクリーンな表面、ディプスエフェクトなしです
• 小文字のナビゲーションを使用しない — スクリーンショットではプライマリリンクに大文字のトラッキングが示されています
• 遊び心のあるまたは装飾的なフォントを使用しない — スクリーンショットでは厳格で機能的なサンセリフとジオメトリックな書体が示されています
• 複雑なグリッドボーダーを使用しない — スクリーンショットではクリーンな、余白による区切りが示されています
• 避ける: 鮮やかまたは彩度の高い色
• 避ける: 角丸または柔らかい形状
• 避ける: 密集した、ごちゃごちゃしたレイアウト

10

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

実ページから取得 · 実 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko