← OpenDesign
厳選・オープン・無料
Ferm Living
キュレーションされた、ライフスタイル重視のエディトリアルレイアウトに焦点を当てたプレミアム家庭用品・家具小売店。
furniture home
01
デザイン DNA
スカンジナビアン ミニマリスト 家庭用品 家具 儀式的
生活のための物品を静かに展示するギャラリー
02
カラー
#383838Ink
#545454Ink soft
#FFFEFABG
#F7F5EFBG soft
#444444Muted
rgba(56, 56, 56, 1)Line
暖色系オフホワイトと深いチャコールの抑制されたパレットで、視覚的な豊かさとコントラストは高品質な写真に依存しています。
03
タイポグラフィ
transitional-serif · geometric-sans
display 56px · 400heading 32px · 400body 16px · 400small 13px · 400大きなディスプレイ見出しにはハイコントラストなトランジショナルセリフを使用 · 本文やUI要素にはクリーンなジオメトリックサンセリフを使用 · 長文テキストの可読性を確保するために適切な行の高さを維持
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
余裕のある広々としたもので、アライメントには24pxの基本単位を強く依存しています。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
ボタンには1px solid rgb(56, 56, 56)を使用し、全体的にボーダーは最小限に
0px 30px 70px 0px rgba(0, 0, 0, 0.3)
06
レイアウト
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
フル幅の写真ヘーローブロックとクリーンで広いマージンの製品グリッドが交互に配置。
07
モーションとインタラクション
200ms micro
300ms small
500ms medium
cubic-bezier(0.4, 0, 0.2, 1) easing
ホバーステートにおける滑らかな透明度とトランスフォームのトランジション · ページ読み込み要素の微かなフェードイン
テキストとボタンボーダーにおける微かな色や透明度の変化 · 新しいステートへのトランジションによる即時フィードバック
08
コンポーネント
button 1pxのボーダーを持つ長方形で、大文字テキスト、最小限のパディング。 card 上揃えのイメージ、明るい背景、ボーダーなしのミニマルな製品カード。 input 1pxのボーダーと角丸を持つクリーンな長方形フィールド。 hero 大きなセリフオーバーレイテキストを持つ、フルブリードの高品質なライフスタイル写真。
09
文体と禁止事項
トーン 洗練され、静かで、控えめな自信に満ちている。 見出し 短く、想起を呼び、イメージ重視。 CTA シンプルで直接的で、ボーダーボックスの大文字テキストをよく使用。 明るいネオンアクセントは使用しない — スクリーンショットではむしろ抑制された大地色のパレットが示されている。 UI要素に重いドロップシャドウを使用しない — スクリーンショットではモーダルにのみ深い大きなブラーシャドウが示されている。 複雑なグラデーション背景を使用しない — スクリーンショットでは実際には固体の暖色系オフホワイト色调が示されている。 遊び心のある丸みのあるサンセリフを使用しない — スクリーンショットではクリーンなジオメトリックサンセリフとハイコントラストなセリフが示されている。 密集した雑然としたグリッドを使用しない — スクリーンショットでは豊かな余白と大きな写真ブロックが示されている。 太字や斜体のディスプレイテキストを使用しない — スクリーンショットではクリーンで標準のウェイトのタイポグラフィが示されている。 避ける: 攻撃的なプロモーション言語や明るく衝突する色 避ける: 雑然としたレイアウトや過度の視覚的ノイズ 避ける: 複雑なグラデーションや重いドロップシャドウ
10
パック内の実スクリーンショット
桌面首屏(hero) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 移动首屏 実ページから取得 · 実 computed styles
11
System Prompt
Ferm Livingは、エディトリアル写真とミニマルなスカンジナビアン美学を融合させたプレミアム家庭用品・家具のeコマースサイトです。コアパレットは暖色系オフホワイトの背景(#FFFEFA、#F7F5EF)と、深いチャコール色のテキスト(#383838)のコントラストに依存しています。タイポグラフィは、高インパクトなディスプレイ見出しに洗練されたトランジショナルセリフを、本文やUI要素にはクリーンなジオメトリックサンセリフを組み合わせています。重要なデザイン制約:明るく高彩度のアクセントカラーは決して使用せず、標準UIコンポーネントに重いドロップシャドウを避け、豊かな余白を維持します。レイアウトは、広いマージンのグリッドに基づき、感情的なつながりを生み出すためにフルブリードのライフスタイル写真を駆使し、抑制されたエレガントなビジュアルシステムが必要です。
ライブラリからもっと
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
なぜ収録: サイトは高品質なエディトリアル写真と豊かな余白を効果的に活用し、標準的なeコマース体験を洗練されたライフスタイルブランドへと昇華させています。