厳選・オープン・無料

Letsbehonest Eu

高コントラストのエディトリアル写真と温かみのあるアースカラーを特徴とするサステナブルファッションブランド。

01

デザイン DNA

エディトリアルファッション雑誌のデジタルストアフロント。

02

カラー

温かみのあるアースカラーの中性色を基調とし、単一の深いレッドアクセントと高コントラストの写真で引き締める。

03

タイポグラフィ

geometric-sans · humanist-sans

• display138px · 700
• h156px · 700
• body14px · 400
• caption11px · 400

ナビゲーションと小見出しには大文字を使用する。 · 大文字要素には十分な文字間隔（2px以上）を維持する。 · 階層構築にはジオメトリックとヒューマニストのサンセリフフォントを混在させる。

04

余白

セクションごとのパディング（例：上114px）を明確にし、十分な垂直方向の余白を設ける。

05

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

最小限。1px solid #868686を控えめな区切り線やインタラクティブ要素に使用。

06

レイアウト

フルワイドのヒーロー画像の後に、十分な余白を持つ中央揃えの単カラムセクションが続く。

07

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

インタラクティブ要素のホバー時、 quickかつsubtleなカラー変化。 · カルーセルスライドの滑らかなトランジション。

控えめなカラー変化や不透明度の変動。通常は0.15sのease-out。 · 即座のビジュアルレスポンス。

08

コンポーネント

• button テキストベースまたはシンプルな長方形ボタン。大文字テキストと十分な水平パディングを採用。
• card ニュートラル背景にフルハイトのモデル写真をフィーチャーしたクリーンな商品カード。
• hero 最小限のオーバーレイテキストと大きなカルーセル矢印を持つ、フルブリードの高解像度エディトリアル写真。

09

文体と禁止事項

• トーン 自信があり、ミニマルで、サステナビリティに焦点を当てている。
• 見出し 短くインパクトがあり、しばしば大きく太い大文字で表示される。
• CTA クリーンで目立たない。テキストベースであることが多い。

• 純白の背景を使用しない — スクリーンショットではプライマリキャンバスとして温かみのあるベージュ（#EEE5D9）が使用されている。
• ナビゲーションを小文字に設定しない — スクリーンショットでは全ナビゲーション項目が大文字表記である。
• 複雑なグラデーションを使用しない — デザインはフラットカラーと高品質な写真に基づいている。
• すべてにサンセリフを使用しない — ブランドマークは太くコンデンスされたサンセリフを使用し、本文テキストはよりヒューマニストである。
• カードにドロップシャドウを追加しない — 商品カードはボーダレスで背景とフラッシュしている。
• プライマリコンテンツにダークモードやダーク背景を使用しない — パレットは主に明るくアースカラー系である。
• 避ける: 派手なネオン色や人工的な色の使用。
• 避ける: 装飾的スクリプトフォントの使用。
• 避ける: 画像上に過度のテキストオーバーレイを用いた雑然としたレイアウトの作成。
• 避ける: 複雑なシャドウやグラデーションの使用。
• 避ける: 不要なボーダーや重いUIクロムの追加。
• 避ける: プライマリナビゲーションに小文字を使用。

10

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

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

11

System Prompt

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