厳選・オープン・無料
Evermade Fi
巨大なセリフタイポグラフィとハイコントラストで鮮やかなカラーパレットで定義される、表現力豊かなエージェンシーポートフォリオ。
AgencyBold TypographyEditorialCase StudyPortfolio
01
デザイン DNA
クリエイティブエージェシーデジタルスタジオ大胆表現力豊かハイコントラスト
大胆なファッションエディトリアルとハイエンドなデジタルエージェンシーのポートフォリオの融合。
02
カラー
#FF0389Accent
#FFFFFFInk
#2D070BInk soft
#FEF0E6BG soft
#FFC7DEBG quiet
rgba(45,7,11,1.0)Line
ハイコントラストで表現力豊か。暗いバーガンディと柔らかなピーチを基調とし、鮮やかなピンクのハイライトを加えています。
03
タイポグラフィ
didone-serif · geometric-sans · monospace
エレガントでハイコントラストのセリフディスプレイフォントと、本文用のクリーンな幾何学サンセリフを組み合わせます。 · メタデータ、ラベル、およびセカンダリテキストにはモノスペースフォントを使用します。 · ナビゲーションとカテゴリラベルには、大文字変換を厳密に使用します。
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
豊かな余白と厳格なグリッド配置。
05
サーフェス (角丸 / 影 / 罫線)
sm · 0px
md · 0px
lg · 0px
pill · 9999px
鋭く、細い1pxのボーダーが、微妙で半透明な方法で頻繁に使用されます。
0px 30px 70px 0px rgba(0,0,0,0.3) · 0px 4px 10px 0px rgba(0,0,0,0.1)
06
レイアウト
1440container
12columns
24pxgutter
768 / 1024breakpoints
巨大でオーバーラップするタイプと中心をずらした画像を特徴とする、非対称のエディトリアルグリッド。
07
モーションとインタラクション
220msmicro
250mssmall
1500msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing
UI状態の変更には、滑らかで減速するトランジション。 · ヒーローテキストと画像のフェードインには、より長く、より劇的なイージング。
インタラクティブ要素に対する微妙な背景色の変化またはわずかな空間移動。 · 滑らかで減速するトランジションによる即時応答。
08
コンポーネント
- button 角丸ピル型で暗い背景、または鋭いボーダーのゴーストスタイル。
- card オーバーサイズのタイポグラフィとクリーンな余白を備えた、ミニマルなケーススタディカード。
- chip タグまたはメタデータとして使用される、モノスペースの大文字テキストラベル。
- input 鋭い角丸のボーダーと明確なラベルを備えた、標準的なフォームフィールド。
- hero 巨大で出血したセリフタイポグラフィとオーバーラップする写真を組み合わせた、劇的なレイアウト。
09
文体と禁止事項
- トーン 自信に満ち、大胆で、非常にプロフェッショナル。
- 見出し 視聴者の注意を引きつける、巨大で表現力豊かなセリフタイプ。
- CTA メタデータにはクリーンで大文字のモノスペース。プライマリアクションには太字のサンセリフ。
- 柔らかく角丸のUIコンポーネントを使用しない — スクリーンショットは鋭い矩形ボーダーと厳格なピル型を示しています。
- 雑踏で複雑な背景を適用しない — スクリーンショットは単色の暗いバーガンディまたはクリーンな柔らかなピーチを示しています。
- 表示テキストに遊び心のある角丸サンセリフを使用しない — スクリーンショットはハイコントラストのディドンセリフを示しています。
- 要素が多すぎてレイアウトを散らかさない — スクリーンショットは豊かな余白とフォーカスされたエディトリアルグリッドを示しています。
- カジュアルで会話的なUIラベルを使用しない — スクリーンショットは構造化された大文字のモノスペースメタデータを示しています。
- 明るいネオングリーンまたはブルーを使用しない — スクリーンショットは暗いバーガンディ、ピンク、ピーチに焦点を当てたパレットを示しています。
- 避ける: 派手なネオングラデーション
- 避ける: 角丸のソフト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
このデザインは、巨大なディドンセリフタイポグラフィとハイコントラストのカラーパレットを活用した、大胆で表現力豊かなエージェンシーポートフォリオです。プライマリアンカーは暗いバーガンディ(#2D070B)と柔らかなピーチ(#FEF0E6)で、鮮やかなピンク(#FF0389)のアクセントが加わります。タイポグラフィは、ディスプレイ(ディドンセリフ)と本文(幾何学サンセリフ)、メタデータ(モノスペース)を厳密に分離し、強力なエディトリアルヒエラルキーを生み出します。レイアウトは空間的で非対称で、クリーンな12カラムグリッドを使用します。重要な制約:角丸のソフトUI形状は決して使用せず、厳密に鋭い矩形または完全なピル型を使用します。表示テキストにカジュアルまたは遊び心のあるタイポグラフィは決して使用せず、常にフォーマルでハイコントラストのセリフに寄り添います。雑踏した背景を避け、巨大なタイプとクリーンな画像に焦点を維持します。
en · zh-CN · zh-TW · ja · ko