厳選・オープン・無料

Christopherireland

厳格なエディトリアルの抑制を持つ、写真家兼ディレクターの洗練されたポートフォリオ

01

デザイン DNA

高級印刷雑誌のレイアウトをウェブに翻訳したもの

02

カラー

色アクセントを一切排除した、温かみのあるオフホワイトの地にインクを用いた厳格なモノクローム

03

タイポグラフィ

didone-serif · geometric-sans · monospace

• display96px · 400
• heading63px · 400
• body16px · 400

04

余白

一貫した30pxのヘッダーpaddingを伴う、ゆったりとした垂直間隔

05

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

ヘッダーとコンテンツエリアを分ける、単一の1px水平線

06

レイアウト

左にテキストナビゲーション、右に大きな特集画像を配置した2カラムレイアウト

07

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

インタラクティブ状態に対する、滑らかなbackground-colorとopacityの遷移

テキストリンクとカテゴリタイトルに対する、控えめな遷移 · 対応するセクションへの直接ナビゲーション

08

コンポーネント

• button hover時にシンプルなアンダーラインが付く、テキストベースのナビゲーションリンク
• card なし。コンテンツは大きなカテゴリタイトル付きのフラットリストとして提示されます
• chip なし
• input なし
• hero 写真家の名前をフィーチャーした、フルワイドでタイポグラフィ主導のヘッダー

09

文体と禁止事項

• トーン 洗練された、静かでプロフェッショナル
• 見出し 大きな、全角大文字またはタイトルケースのセリフ体タイポグラフィ
• CTA 控えめなテキストリンク

• 鮮やかなアクセントカラーを使用しない — スクリーンショットはクリーム地に厳格な白黒のパレットを示しています
• 角丸を使用しない — スクリーンショットは完全にフラットで矩形的な美学を示しています
• ドロップシャドウを使用しない — スクリーンショットは奥行き効果のないクリーンなレイアウトを示しています
• 小さく密集した段落を使用しない — スクリーンショットは豊富なホワイトスペースと大きな見出しを示しています
• 見出しに装飾的なサンセリフフォントを使用しない — スクリーンショットはディスプレイ用にハイコントラストのセリフ体を使用しています
• 複雑なグリッドオーバーレイを使用しない — スクリーンショットはシンプルなアラインメントとホワイトスペースに依存しています
• 避ける: 明るい色
• 避ける: 装飾的な要素
• 避ける: 雑然とした背景

10

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

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

11

System Prompt

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