厳選・オープン・無料

Henry Codes

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

PortfolioBold TypographyEditorialStudioDark Mode
Henry Codes のスクリーンショット
↓ デザインシステムをダウンロード (8 MB)OpenDesign で開く

オリジナル: https://henry.codes

📦 パックの中身を見る →

01

デザイン DNA

個人ポートフォリオクリエイティブウェブデベロッパーデザイナーデンバー大胆

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

02

カラー

#2A2722Ink
#FAFAFABG
#666666Muted
rgba(42,39,34,0.1)Line

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

03

タイポグラフィ

transitional-serif · geometric-sans

04

余白

4px
8px
16px
24px
32px
48px
64px
96px

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

05

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

sm · 0px
md · 12px
lg · 12px
pill · 999px

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

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

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

07

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

150msmicro
200mssmall
400msmedium
cubic-bezier(0.645, 0.045, 0.355, 1)easing

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

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

08

コンポーネント

09

文体と禁止事項

10

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

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

11

System Prompt

このサイトは、ウェブデベロッパー&デザイナーのための、大胆で実験的なクリエイティブポートフォリオです。高コントラストモノクローム背景(#FAFAFAと#2A2722)と、幾何学的sans-serif本文テキストと組み合わされた巨大なトランジショナルセリフ表示タイポグラフィが特徴です。レイアウトはブラタリストでエディトリアルであり、標準的なグリッド規約を破ることがよくあります。重要な禁止事項:ソフトなパステルカラーを使用しない、遊び心のある丸みのあるUIを使用しない、伝統的な小さなグリッドを使用しないこと。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック(エージェント用) ↗

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