厳選・オープン・無料

Vitaarchitecture

厳格なミニマリズムと洗練されたタイポグラフィディテールのバランスを取った、洗練された建築ポートフォリオ。

01

デザイン DNA

繊細なセリフアクセントを持つ、清廉なギャラリースペース。

02

カラー

建築写真を活かすため、ハイコントラストの中性色を極度に抑制して使用。

03

タイポグラフィ

didone-serif · grotesque-sans

• display196px · 200
• headline48px · 400
• body16px · 400

'214'のような数字などの、大きくエレガントなディスプレイ要素にはディドーンセリフを使用。 · 機能的なUI、ナビゲーション、標準の段落テキストにはグロテスクサンズを使用。 · 洗練された美学を保つため、すべてのタイポグラフィで tightened negative letter-spacing を維持。

04

余白

例：上下207pxのような、孤立した垂直パディングを用いた広大なホワイトスペース

05

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

分離のために控えめに使用される、細く鋭い黒い線

06

レイアウト

巨大な空きスペースが支配する、単一カラムまたは高度に構造化された非対称グリッド

07

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

インタラクション時のカラーフェード · 要素の透明度トランジション

インタラクティブ要素での微妙なテキストカラー変化。 · 最小限のビジュアルフィードバックで即座に応答。

08

コンポーネント

• button ホバー時のシンプルなアンダーラインまたは状態変化を伴う、テキストのみ。
• card 広大なホワイトスペースを持つタイポグラフィ駆動で、背景コンテナなし。
• hero 大きなディドーン数字と細い水平線を持つ、スパースなタイポグラフィ。

09

文体と禁止事項

• トーン 自信に満ち、静寂で、非常に洗練されている。
• 見出し 最小限で、often large numbers or single words.
• CTA 控えめで、機能的なテキスト。

• シャドウを使用しない — スクリーンショットは完全にフラットなサーフェスを示しています。
• ボーダーラディウスを使用しない — スクリーンショットは鋭く、丸みを帯びない角を示しています。
• 鮮やかな色を使用しない — スクリーンショットは完全にモノクロ/白黒です。
• ドロップシャドウを使用しない — スクリーンショットは完全にフラットデザインに依存しています。
• インターフェースを雑然とさせない — スクリーンショットは極端なネガティブスペースを示しています。
• ディスプレイテキストにサンズを使用しない — スクリーンショットでは大きな数字にディドーンセリフが使用されています。
• 避ける: 感嘆符
• 避ける: マーケティング用語
• 避ける: カラフルなCTA
• 避ける: 装飾的なUI要素

10

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

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

11

System Prompt

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