厳選・オープン・無料

Mybrentano Ch

ナチュラルなホリスティックヘルスケア製品のための、クリーンでエディトリアルなEコマースサイト。

01

デザイン DNA

クリーンな美学とオーガニックな温かみを融合した、モダンでデジタルネイティブなアポセカリー。

02

カラー

温かみのあるベージュとダークインクによる、ハイコントラストのナチュラルパレット。

03

タイポグラフィ

monospaced-sans · sans-serif

• display60px · 400
• h130px · 400
• body18px · 400
• small15px · 400

すべてのタイポグラフィは、クリーンでジオメトリックなサンセリフフォントファミリーを使用します。 · 見出しにはテクニカルな精度のためにモノスペースのバリアントを使用します。 · フォントウェイトは、すべてのテキストで一貫してレギュラー（400）です。

04

余白

標準的な4pxをベース単位とした、豊かなホワイトスペース。

05

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

構造と区切りのために使用される、薄い1pxの実線黒ボーダー。

06

レイアウト

トップナビゲーションバーとコンテンツのための縦方向に積み重なるフローを備えた、グリッドベースのレイアウト。

07

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

ホバーステートでの滑らかなトランジション · ページ遷移時の優しいイージング

インタラクティブな要素上の繊細な不透明度や色の変化。 · すべてのクリック可能な領域に対する標準的なポインターカーソル。

08

コンポーネント

• button ピルシェイプの言語トグルと円形のアイコンボタンを備えた、ミニマルなアウトラインボタン。
• card 薄いボーダー、揃えられたテキスト、背景色のない、クリーンなプロダクトカード。
• chip ピルシェイプ内部のシンプルなテキストベースの言語トグル。
• input 目立つ背景のない、下線付き入力フィールド。
• hero オーガニックで重なり合う写真のコラージュを伴う、大型で左揃えのモノスペース見出し。

09

文体と禁止事項

• トーン プロフェッショナルでありながらも親しみやすく、情報を提供する。
• 見出し モノスペースフォントによる、直接的で明確、ややテクニカルなスタイル。
• CTA シンプルで直接的。しばしば「Kaufen（購入）」の単語のみ。

• ドロップシャドウを使用しない — スクリーンショットではフラットでボーダーベースのデザインが示されています。
• グラデーション背景を使用しない — スクリーンショットでは単色の温かみのあるベージュ背景が示されています。
• コンテナに角丸を使用しない — スクリーンショットではシャープで四角い角が示されています。
• 強調のために太字のフォントウェイトを使用しない — スクリーンショットでは一貫してレギュラーウェイトが示されています。
• 明るく高彩度のアクセントカラーを使用しない — スクリーンショットでは控えめな黒とベージュのパレットが示されています。
• メインコンテンツの中央揃えレイアウトを使用しない — スクリーンショットでは強力な左揃えのグリッドが示されています。
• 避ける: 派手で目立つアニメーション
• 避ける: ごちゃごちゃしたインターフェース
• 避ける: 過度にカジュアルな言葉遣い

10

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

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

11

System Prompt

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