厳選・オープン・無料

Kengo Kuma

世界クラスの建築スタジオのための、抑制された写真ポートフォリオ。

01

デザイン DNA

写真に焦点を当てたミニマルな建築スタジオのポートフォリオ。

02

カラー

建築写真が主役となる、中立的で非常に抑制されたパレット。

03

タイポグラフィ

geometric-sans · system-sans

• display18px · 300
• body13px · 300

すべてのテキストにライトウェイト（300）を使用。 · 洗練された印象を出すため、一貫してネガティブな文字間隔（-0.32px）を維持。 · メタデータと日付にはタイトな行間を使用。

04

余白

ボタンとリスト項目に一貫して12pxのパディングを使用。

05

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

1pxの実線ボーダーカー、主に繊細な区切り線として使用。

rgba(0, 0, 0, 0.5) 0px 0px 3px 0px

06

レイアウト

大きな没入感のあるヒーロー画像に続き、クリーンなプロジェクトカードのグリッド。

07

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

hover時の滑らかなトランジション（0.2s ease-in-out）。 · コンテンツセクションの繊細なフェードイン。

インタラクティブ要素の繊細な色の変化や不透明度の変更。 · すべてのリンクとインタラクティブ要素に対する標準のポインターカーソル。

08

コンポーネント

• button 最小限のテキストベースのナビゲーションリンク。大文字でライトウェイト。
• card 画像中心のカードで、繊細なボーダーとその下にメタデータ。
• hero フルブリードの高品質建築写真。

09

文体と禁止事項

• トーン プロフェッショナルで抑制的、かつ国際的。
• 見出し クリーン、大文字、幾何学的なサンセリフ。
• CTA 最小限、テキストベース、控えめ。

• 太字のタイポグラフィは使用しない。スクリーンショットではすべてのテキストがウェイト300。
• 鮮やかなカラーパレットは使用しない。スクリーンショットでは中立的なモノクロムスキーム。
• 複雑なUIコンポーネントは使用しない。スクリーンショットではミニマルで写真中心のレイアウト。
• 装飾的なアイコンやイラストは使用しない。スクリーンショットでは写真とテキストのみ。
• 重いシャドウやグラデーションは使用しない。スクリーンショットではフラットでクリーンなサーフェス。
• 角丸を過度に使用しない。スクリーンショットではシャープまたは最小限のボーダーラジウス。
• 避ける: 重厚で太字のタイポグラフィは避ける。
• 避ける: 彩度の高い色やプライマリカラーは避ける。
• 避ける: 装飾的なUI要素やイラストは避ける。

10

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

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

11

System Prompt

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