厳選・オープン・無料

Footer

太字のタイポグラフィとエディトリアルなプレゼンテーションに焦点を当てたキュレーション・デザイン・ギャラリー。

01

デザイン DNA

クリーンでタイポグラフィ重視のギャラリー・キュレーション・プラットフォーム

02

カラー

白とダークテキストの高いコントラストを実現する、厳密なモノクロマチック構成

03

タイポグラフィ

grotesque-sans · humanist-sans

• display32px · 600

プライマリ・テキスト：18px、トラッキング -0.54px · セカンダリ・テキスト：14px、トラッキング -0.42px · 見出し：600ウェイト · 本文：400ウェイト

04

余白

4、8、12、16、24、40、60の一定のインクリメントによる间距

05

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

カードやボタンに1px solid rgba(36,36,36,0.12)のボーダー

06

レイアウト

ギャラリーカード用のマルチカラムグリッド・レイアウト

07

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

hover時の控えめなフェード・トランジション · 色および背景色の滑らかな変化 · 状態変化のための不透明度トランジション

色および背景色のトランジション（0.15秒） · 標準のポインターカーソル

08

コンポーネント

• button ピル-shaped、ボーダー・ラディウス 1600px、黒または白のフィル
• card 画像を重視したデザイン。ボーダーは最小限で、タイポグラフィは明確に。
• chip フィルタリング用の小さな丸みのあるタグ
• hero 控えめなアニメーション付きの大型タイポグラフィック・イントロダクション

09

文体と禁止事項

• トーン プロフェッショナルで、クリーンかつキュレーションされた
• 見出し 太字、狭いトラッキング、大文字または大きなケース
• CTA 直接的でアクション志向。ピル-shapedボタンを使用

• 鮮やかなアクセント色は使用しない — スクリーンショットは厳格なモノクロマチック・パレットを示しています
• ピルボタン以外の角丸は使用しない — スクリーンショットはカードにシャープな角を示しています
• ドロップ・シャドウは使用しない — スクリーンショットはフラットでボーダー定義されたサーフェスを示しています
• 装飾的なフォントは使用しない — スクリーンショットはクリーンなgrotesque-sansおよびhumanist-sansを使用しています
• 密集したレイアウトは作成しない — スクリーンショットはたっぷりした余白と明確なヒエラルキーを使用しています
• 複数のフォントファミリーは使用しない — スクリーンショットは主にInterを異なるウェイトで使用しています
• 避ける: 雑然としたインターフェース
• 避ける: 過度な装飾要素
• 避ける: 曖昧な表現

10

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

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

11

System Prompt

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