厳選・オープン・無料

Zaha Hadid Architects

世界的に有名な建築スタジオの、没入感のある写真的デジタルアーカイブ。

01

デザイン DNA

対話的に構築されたパラメトリック建築構造

02

カラー

フルブリードの建築写真に完全に従属するハイコントラストのモノクロ基盤。

03

タイポグラフィ

geometric-sans · humanist-sans

• display48px · 300
• heading16px · 700
• body12px · 400

プライマリラベルとナビゲーションリンクは厳密に大文字表記 · プライマリブランド識別子には、エレガントで軽やかな印象を維持するためのライトウェイト（300）を使用

04

余白

厳格な垂直リズムではなく、画像構図によって導かれる不規則なモジュールベースのレイアウト

05

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

1px solid rgba(255, 255, 255, 0.15)

4px 4px 8px 0px rgb(0, 0, 0) · 0px 32px 68px 0px rgba(0, 0, 0, 0.3)

06

レイアウト

フルビューポートの写真背景の上に配置された自由なオーバーレイモジュール

07

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

方向矢印ナビゲーションによる背景画像カルーセル · 追加モジュールのスクロールベース垂直表示

すべてのインタラクティブ要素のカーソルがポインタに変化し、テキストリンクには微細な透明度のシフトが適用される · モジュールの拡張または背景のトランジションをトリガー

08

コンポーネント

• button 大文字スタイルとオプションの細いボーダーを持つ透明なテキストリンク
• card テキストと補助画像を含む半透明のダークオーバーレイ
• input 最小限の「Go」トリガーボタンを持つシンプルなテキストフィールド
• hero 浮遊する、重なり合う情報モジュールを伴うフルビューポートの建築写真

09

文体と禁止事項

• トーン 権威、先駆的、制度的
• 見出し 太字、大文字、ミニマル
• CTA 控えめな大文字テキストリンク、またはシンプルな「Go」ボタン

• 明るいアクセントカラーを使用しない — スクリーンショットは黒、白、グレーの厳格なモノクロパレットを示す
• すべてのテキストを中央揃えにしない — スクリーンショットはプライマリコンテンツモジュールで左揃えのテキストを示す
• 太いフォントウェイトを使用しない — スクリーンショットはロゴがウェイト300、本文が400を示す
• 標準的なグリッドレイアウトを使用しない — スクリーンショットは写真の上に重なる自由なモジュールレイアウトを示す
• 実体背景色を使用しない — スクリーンショットは全体の背景が写真画像であることを示す
• コンテンツモジュールに大きなパディングを使用しない — スクリーンショットは6px 10pxのようなタイトなパディングを示す
• 避ける: 親しみやすい、カジュアルな言葉遣い
• 避ける: 過度に説明的、または冗長な文
• 避ける: 明るく鮮やかなカラーアクセント

10

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

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

11

System Prompt

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