厳選・オープン・無料

Loveseen

インパクトの強いフォトグラフィーとエレガントなセリフ書体を駆動する、プレミアムビューティーEコマースサイト。

01

デザイン DNA

ビューティーフォトグラフィーを厳選したギャラリー

02

カラー

スキントーンを基調とした暖かみのあるニュートラルパレットで、写真を主役に。

03

タイポグラフィ

didone-serif · geometric-sans

• display48px · 400
• heading30px · 400
• body16px · 400
• caption13px · 400

ナビゲーションとUI要素は全て大文字 · 見出し書体はタイトな字間 · 大文字のUIテキストは字間を広めに

04

余白

セクション間の十分な垂直方向の余白

05

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

控えめなニュートラルカラーの1pxソリッドボーダー

06

レイアウト

フルブリードのヒーロー画像の後に、グリッドセクションを配置

07

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

フェードイン · スライドアップ

透明度の変化と微妙な色調のシフト · 滑らかなトランジションによる即座の状態変化

08

コンポーネント

• button 大文字テキストのミニマルなアウトラインボタン
• card カードのボーダーは不可視にし、余白と画像で構成
• chip 角丸のシンプルなアウトラインチップ
• input 最小限のスタイリングを施したアンダーラインスタイルの入力欄
• hero 透明なナビゲーションオーバーレイを持つ、分割画面型の写真ヒーロー

09

文体と禁止事項

• トーン 自信に満ち、包括的で洗練された
• 見出し エレガントで、しばしばディドン・セリフの見出し書体を使用
• CTA ミニマル、大文字、しばしばアウトラインまたはプレーンテキスト

• 高彩度のアクセントカラーを使用しない — スクリーンショットは控えめなニュートラルパレットを示しています。
• 重いドロップシャドウや3D効果を使用しない — スクリーンショットはフラットでクリーンなサーフェスを示しています。
• カードやボタンに丸みのある角を使用しない — スクリーンショットはシャープでクリーンなエッジを示しています。
• ナビゲーションに小文字テキストを使用しない — スクリーンショットは全て大文字のUI要素を示しています。
• 本文に太字ウェイトを使用しない — スクリーンショットは一貫した400ウェイトを示しています。
• 雑然とした背景パターンを使用しない — スクリーンショットは無地でソフトなニュートラル背景を示しています。
• 避ける: 派手なカラー
• 避ける: 装飾的なUI要素
• 避ける: 雑然としたレイアウト

10

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

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

11

System Prompt

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