厳選・オープン・無料
Xihestudio
ハイプロファイルなエージェントワークを紹介する、ミニマルでダークテーマのパーソナルデザインポートフォリオ。
PortfolioStudioBold TypographyPremiumClean
01
デザイン DNA
ポートフォリオデザインスタジオアートディレクションミニマルクリーン
高級デザインポートフォリオのデジタルアーカイブとして、スターケでミニマルなインターフェースで提示される。
02
カラー
#FE2A2AAccent
#ffffffInk
rgba(255,255,255,0.75)Ink soft
#131312BG
rgba(255,255,255,0.1)Line
作品への集中を維持するための、単一の控えめな赤のアクセントを持つ高コントラストダークモード。
03
タイポグラフィ
geometric-sans · mono
- display
46px · 400 - body
14px · 400 - caption
12px · 400
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
十分なパッディングを持つ厳格なグリッド。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
1px solid rgba(255,255,255,0.1)
06
レイアウト
1400container
12columns
24pxgutter
768 / 1024breakpoints
テキスト用のマルチカラムグリッド、ポートフォリオ画像用の大規模なメーソンリーレイアウト。
07
モーションとインタラクション
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
ホバーステートとページ読み込み時の透明度トランジション。
リンクとポートフォリオアイテムの微妙な透明度の変化。 · プロジェクト詳細ページへの直接ナビゲーション。
08
コンポーネント
- button 方向矢印付きのテキストリンク。最小限のボーダー、またはなし。
- card 最小限のパッディングを持つ大画像ブロック。主要なナビゲーションとして機能。
- hero 大文字のタイポグラフィヘッドラインと、その下にポートフォリオのサムネイルグリッド。
09
文体と禁止事項
- トーン プロフェッショナルで、簡潔、かつ控えめ。
- 見出し インパクトを与えるための、大きく、カーニングが詰められた、全角または太字のセンテンスケース。
- CTA 次のセクションへの移動を示す、控えめな方向矢印。
- 明るい色やネオン色を使用しない — スクリーンショットでは、暗く、ほぼ黒の背景に白いテキストが使われている。
- 装飾的な書体やスクリプトフォントを使用しない — タイポグラフィは厳密に幾何学的でモノスペースのサンセリフである。
- 丸みを帯びた、フレンドリーなUI要素を使用しない — レイアウトは鋭く、クリーンで、建築的なグリッドを使用している。
- ドロップシャドウやグラスモーフィズムを追加しない — サーフェスは完全にフラットでソリッドである。
- 複数のアクセントカラーを使用しない — スクリーンショットでは、単一の赤いアクセント（#FE2A2A）が控えめにしか使われていない。
- すべてのコンテンツを中央揃えにしない — レイアウトは強力な左揃えテキストグリッドに依存している。
- 避ける: 派手なアニメーション
- 避ける: 鮮やかな色
- 避ける: 密集した段落テキスト
10
パック内の実スクリーンショット
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
これはアートディレクターのための高級パーソナルデザインポートフォリオ。デザインは、大規模な幾何学サンセリフタイプ（Monument Grotesk）と厳格なポートフォリオ画像グリッドに焦点を当てた、スターケでダークテーマのミニマルインターフェース（#131312）。テキストは主に白色（#ffffff）で、セカンダリの控えめな白（rgba(255,255,255,0.75)）。単一の高彩度赤アクセント（#FE2A2A）が非常に控えめに使用。レイアウトはカラムベースで、十分な余白。重要な禁止事項：明るい背景を使用しない、装飾的なフォントを使用しない、重いドロップシャドウや複雑なアニメーションを使用しない、複数のアクセントカラーを使用しない、密集したまたはごちゃごちゃしたレイアウトを使用しない、主要コンテンツのテキストを中央揃えにしない。
en · zh-CN · zh-TW · ja · ko