厳選・オープン・無料

Tate

テート・ギャラリー向けの洗練された文化ウェブサイト。大胆なタイポグラフィ、鮮やかなヒーローセクション、クリーンでグリッドベースのレイアウトを特徴とします。

01

デザイン DNA

大胆なエディトリアル写真を用いたミニマルなギャラリーカタログ。

02

カラー

黑白グレーの高コントラスト中立色を基調とし、一点の大胆なイエローをアクセントとして配置。写真が主なビジュアルの豊かさを提供します。

03

タイポグラフィ

geometric-sans · humanist-sans

• display46px · 400
• h222px · 400
• body17px · 400
• caption14px · 400
• nav14px · 400

セクションタイトルは、階層を確立するために幅広いトラッキング（大文字）を使用します。 · 本文は読みやすさを考慮し、快適な17pxサイズを維持します。 · ヒーロータイトルは大きめですが、通常のフォントウェイトを維持します。

04

余白

コンテンツブロック間に一貫した16px/32pxのパディングを用いた、豊かな垂直リズム。

05

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

ボーダーの使用は最小限。主にナビゲーション項目やインタラクティブ要素の控えめな下線（1px）に使用します。

rgb(128, 128, 128) 0px 0px 5px 0px

06

レイアウト

中央揃えの最大幅コンテナを持つ、堅固な12カラムグリッドシステム。

07

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

インタラクティブ要素に対する標準的なhover遷移。 · モバイルメニューの表示に対する控えめなフェード遷移。

リンクやボタンに対する、微妙な背景色や色の変化。 · 標準的なボタン押下フィードバック。

08

コンポーネント

• button 白いテキストと右向き矢印を備えた、ソリッドブラックまたはティール色のブロック。明確なCTA（行動喚起）を強調します。
• card 画像を前面に出したカード。最小限または背景スタイルなし。グリッドアイテム間の豊かな余白に依存します。
• hero 一方の側に鮮やかなフルブリード画像、もう一方にソリッドカラーのブロック（例：イエロー）と高コントラストのタイポグラフィを配した分割レイアウトのヒーロー。

09

文体と禁止事項

• トーン インスティテューショナルで教育的でありながら、歓迎的でアクセシブル。
• 見出し 大胆で大文字、記述的。主題や場所に焦点を当てます。
• CTA 直接的で行動志向。前進を示す「→」矢印を伴うことが多いです。

• 陰影（ドロップシャドウ）で階層を表現しない — デザインはフラットなカラーブロックと余白に依存します。
• 複数の競合するアクセントカラーを使用しない — パレットは厳密に黒、白、グレー、特定の1色のイエロー/ティールです。
• セリフフォントを使用しない — タイポグラフィは厳密にサンセリフで、モダンでクリーンな美学を強調します。
• 角丸を大きくしない — ボタンやカードは最小限または角張った角を使用します。
• 密集したテキストブロックでレイアウトを散らかさない — 豊かなスペーシングを維持し、画像に焦点を当てます。
• 太字フォントウェイトを使用しない — 最大のディスプレイテキストでも通常（400）ウェイトを使用します。
• 避ける: 過度にカジュアルな口語表現。
• 避ける: 芸術に関連しない複雑な専門用語。
• 避ける: 感叹符の過剰な使用。

10

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

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

11

System Prompt

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