厳選・オープン・無料

Henry Codes

デンバーを拠点とするウェブデベロッパー＆デザイナーのための、大胆でタイポグラフィ主導のクリエイティブポートフォリオ。

01

デザイン DNA

ハイファッションのエディトリアルとアンダーグラウンド雑誌が融合したような、大胆で実験的なクリエイティブポートフォリオ。

02

カラー

極端なタイポグラフィの密度と、ブラタリストレイアウトの変化を伴う高コントラストモノクローム。

03

タイポグラフィ

transitional-serif · geometric-sans

• display77px · 400
• body16px · 400

04

余白

重厚なタイポグラフィをバランスさせるための、豊かな余白を持つ厳格な4px基本単位。

05

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

シンプルな2px実線ボーダーまたはボーダーレス；区切りには余白とタイプウェイトに依存。

06

レイアウト

明暗の背景を交互に使用するフルブリードセクション。

07

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

リンクとインタラクティブ要素の控えめなホバートランジション

控えめな色または幅のトランジション。 · バウンスやスケール効果のない即座の応答。

08

コンポーネント

• button 控えめなテキストベースリンクとホバートランジション。
• card 階層表現にタイポグラフィに依存する、最小限のボーダーレスコンテナ。
• hero ビューポート全体の幅を埋め尽くす、巨大でオーバーサイズのタイポグラフィ。

09

文体と禁止事項

• トーン 大胆で、謝罪せず、非常にパーソナル。
• 見出し 注目を集めるアグレッシブでオーバーサイズのセリフフォントタイポグラフィ。
• CTA コンテンツ自身に語らせる、控えめなテキストベースの行動喚起。

• ソフトなパステルカラーを使用しない — スクリーンショットは高コントラストモノクロームパレットを示しています。
• 遊び心のある丸みのあるUI要素を使用しない — スクリーンショットはシャープでブラタリストのタイポグラフィを示しています。
• 小さく密集したグリッドを使用しない — スクリーンショットは巨大でフルブリードのタイポグラフィレイアウトを示しています。
• 控えめで装飾的なイメージを使用しない — スクリーンショットは大胆で、ピクセル化または抽象的なアートを示しています。
• 伝統的で安全なレイアウトを使用しない — スクリーンショットは実験的でオーバーラップするテキストを示しています。
• 単一の背景色を使用しない — スクリーンショットは純白と準黒のセクションを交互に使用しています。
• 避ける: 汎用的な企業語
• 避ける: ソフトまたは遊び心のあるデザイン要素
• 避ける: 伝統的なグリッドベースのレイアウト

10

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

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

11

System Prompt

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