厳選・オープン・無料

Leonidkostetskyi

大胆で幾何学的なディスプレイテキストと余裕のあるホワイトスペースを強調した、タイポグラフィー中心のパーソナルポートフォリオ。

01

デザイン DNA

ハイエンドのデザインスタジオのポートフォリオ、またはモノグラフ。

02

カラー

巨大なダークブラウンのディスプレイテキストと、暖かみのあるテクスチャ付きオフホワイト背景の間のハイコントラスト。

03

タイポグラフィ

geometric-sans

• display-hero165px · 400
• display-large142px · 400
• body-sm12px · 400

すべてのテキストは大文字 · ディスプレイテキストはタイトなトラッキング（-3.3pxから-4.125px）を使用 · 本文テキストは標準のトラッキングを使用

04

余白

セクション間に巨大な垂直ギャップ（225pxパディング）を設けた、余裕のあるホワイトスペース。

05

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

控えめな1pxボーダーを最小限に使用。主にホバーステータスや小さな仕切りに使用。

06

レイアウト

ハイコントラストのタイポグラフィーヒーローレイアウト。巨大なテキストブロックが特定の角に配置されたフルスクリーン構成。

07

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

テーマ切り替え時の滑らかなcolorとbackground-colorのトランジション · インタラクティブ要素のtransformトランジション

ナビゲーションアイテムの下に点線アンダーラインが現れる。 · 新しいセクションやステータスへの滑らかなトランジション。

08

コンポーネント

• button ホバーステータスで点線アンダーラインが付くミニマルなテキストリンク。
• card 従来のカードは使用せず、コンテンツは大きなタイポグラフィーブロックとして提示。
• chip テーマ切り替えに使用する小さな円形ドット。
• input 提供されたスクリーンショットには表示されません。
• hero 2つの大きなテキストブロック（'LEONID KOSTETSKYI'と'CREATIVE DIRECTOR'）を画面上に斜めに配置した、巨大なタイポグラフィーコンポジション。

09

文体と禁止事項

• トーン 自信に満ち、洗練され、控えめ。
• 見出し 巨大な大文字の幾何学サンセリフディスプレイタイプ。
• CTA 小文字、大文字、モノスペースまたはサンセリフのテキストリンク。

• ディスプレイテキストに小文字を使用しない — スクリーンショットではすべてのテキストが大文字
• 装飾的またはスクリプトフォントを使用しない — スクリーンショットではクリーンな幾何学サンセリフを使用
• 明るいまたはネオンのアクセントカラーを追加しない — スクリーンショットではブラウンとオフホワイトの控えめなモノクロパレットを使用
• 重いドロップシャドウを使用しない — スクリーンショットではシャドウのないフラットでテクスチャベースのデザインを採用
• 多くのカラムを含む複雑なグリッドレイアウトを使用しない — スクリーンショットではゆったりとした非対称レイアウト
• 小さく詰まったタイポグラフィーを使用しない — スクリーンショットでは最大165pxの巨大なディスプレイサイズを採用
• 避ける: 雑然としたレイアウトや過度な画像使用を避ける
• 避ける: 明るい、高彩度のアクセントカラーを避ける
• 避ける: 装飾的なセリフフォントを避ける
• 避ける: ドロップシャドウや複雑なグラデーションを避ける
• 避ける: 小文字のディスプレイテキストを避ける
• 避ける: センタリングされたテキストブロックを避ける

10

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

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

11

System Prompt

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