厳選・オープン・無料

Lunchconcept

大胆なエディトリアル写真と厳格なタイポグラフィを用いた、キュレーションファーストのファッションプラットフォーム。

01

デザイン DNA

ギャラリーが企画するハイエンドファッション雑誌

02

カラー

暖色系オフホワイトをベースとした高コントラストのエディトリアルパレット。ステータス表示には単独のbold redアクセントを使用。

03

タイポグラフィ

high-contrast-serif · humanist-sans

• display120px · 400
• heading32px · 700
• body12px · 400

04

余白

エディトリアル調のタイトなスペーシング。大きな要素の周囲には十分な余白を確保。

05

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

ページセクション下部に1px solid blackボーダーを設定

06

レイアウト

フルブリード写真に続き、厳密で密集したマルチカラム商品グリッドを配置。

07

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

ホバーおよびトップレベルナビゲーションにおけるスムーズなトランジション

カーソルポインタ。色や透過度のスムーズな遷移 · 重いロードアニメーションなし。即座にステートを変化させる

08

コンポーネント

• button 大文字スタイルのテキストベースナビゲーションリンク
• card 画像、デザイナー名、商品名、価格から構成されるボーダーレス商品カード
• chip 「SOLD OUT」ステータスを明るい赤色テキストで表示
• hero ビューポート全体を覆う画像に、重なり合う巨大な3Dメタル文字を配置

09

文体と禁止事項

• トーン 直接的、ミニマリスト、かつ権威あるトーン
• 見出し 短く、bold、大文字で、インパクトのあるスタイル
• CTA 目立つボタンではなく、控えめなテキストリンク

• 角丸を使用しない — スクリーンショットではすべて厳格な90度のエッジが確認できる
• カラフルな背景を使用しない — スクリーンショットでは一貫して暖色系オフホワイト（#F4F1E4）のベースを使用
• カジュアルなサンセリフフォントを使用しない — スクリーンショットでは高コントラストのセリフと、クリーンなhumanist sansのミックスが確認できる
• ドロップシャドウを使用しない — スクリーンショットでは完全にフラットでボーダーレスの商品カードが確認できる
• 明るく多色のアクセントを使用しない — スクリーンショットではステータス表示にのみ、特定の赤（#FF0000）が単独で使用されている
• 本文コンテンツのテキストを中央揃えにしない — スクリーンショットでは厳格な左揃えのエディトリアル構造が確認できる
• 避ける: 雑然としたレイアウト
• 避ける: 過度なプロモーションテキスト
• 避ける: 遊び心のある、あるいは丸みのある要素

10

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

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

11

System Prompt

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