厳選・オープン・無料

Idheal Fr

IDHEALは、大胆で構造的なタイポグラフィとクリーンなエディトリアルグリッドを用い、住宅・都市計画に関する研究を提示します。

01

デザイン DNA

ハイエンドの学術誌、またはアート展覧会のカタログ

02

カラー

高コントラストのモノクロームベースに、分類用のシャープでクロマティックなアクセント

03

タイポグラフィ

grotesque-sans · transitional-serif · monospace

• display56px · 700
• body16px · 400

UI要素と見出しにはHelvetica Neueを使用 · ナラティブ本文にはNew Century Schoolbookを使用

04

余白

グリッドベースで、読みやすさのために一貫した垂直方向の間隔を確保

05

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

薄い1pxの実線（黒またはカラーボーダー）をチップに使用

4px 2px 4px rgba(0,0,0,0.2) · 2px -1px 6px rgb(237,237,237)

06

レイアウト

巨大な文字がコンテンツセクションを分割する構造的グリッド

07

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

背景色やフォントサイズの変化に対するスムーズなトランジション

クリック可能な要素上の繊細な背景色の変化 · 即座の状態変化

08

コンポーネント

• button アウトライン付きピル形状。実線ボーダーと繊細なシャドウ。
• card 構造線で区切られたフラットなコンテンツブロック
• chip カラードットに小文字テキストを配置した丸みのあるピル
• input ミニマリスト。おそらくアウトラインまたはアンダーライン。
• hero 文字がビューポート全体にわたる巨大なタイポグラフィアレンジメント

09

文体と禁止事項

• トーン 学術的、権威的、かつ正確
• 見出し 太字、大文字、非常に構造的
• CTA シンプル、直接的、しばしば小文字または文頭のみ大文字

• プライマリコンテナに柔らかく丸い角を使用しない — スクリーンショットはシャープなエッジと厳格なグリッド線を示しています
• マルチカラーグラデーションの背景を使用しない — スクリーンショットは白、グレー、黒のフラットな実色ブロックを示しています
• 深度ために重いドロップシャドウを使用しない — スクリーンショットは非常に最小限の、方向性のあるシャドウ、あるいはなしを示しています
• センタリングされた、流れるようなレイアウトを使用しない — スクリーンショットは文字がカラムを作り出す厳格で非対称なグリッドを示しています
• プライマリヒーローブランドに小文字を使用しない — スクリーンショットは「IDHEAL」を全て大文字で示しています
• ナビゲーションを複雑なUIの背後に隠さない — スクリーンショットはアイコン付きのシンプルなハンバーガーメニューを示しています
• 避ける: 遊び心のある言葉
• 避ける: 過度な装飾要素
• 避ける: 雑然としたレイアウト

10

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

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

11

System Prompt

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