厳選・オープン・無料

Xxxi Studio

コンセプトの革新と技術的な実行を橋渡しする、洗練された建築実践。

StudioPremiumCleanArchitectureRefined
Xxxi Studio のスクリーンショット
↓ デザインシステムをダウンロード (110 MB)OpenDesign で開く

オリジナル: https://xxxi.studio

📦 パックの中身を見る →

01

デザイン DNA

建築プロダクトデザイン建設コンセプト技術

メディア（ウェブサイト）がスタジオの物理的なプロジェクトの正確さと素材の生々しさを反映する、ハイエンド建築ポートフォリオ。

02

カラー

#000000Ink
#FFFFFFBG
#E5E7EBMuted
rgba(229, 231, 235, 1)Line

高品質な建築写真のためのニュートラルで控えめな枠組みとなる、厳格なモノクローパレット。

03

タイポグラフィ

grotesque-sans

モダンで実用的な美学を維持するため、すべてのテキストにクリーンなグロテスクサンセリフを使用。 · 視覚的な重みを避けるため、フォントウェイトを400に一貫して維持。

04

余白

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

レイアウトは、フルブリード写真がビューポートを支配できるよう、最小限のパディングを備えた厳格な4pxベースグリッドに依存。

05

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

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

極めて最小限で、必要な場合にのみ1pxのソリッドライン（#E5E7EB）を使用して繊細な区切りをつける。

06

レイアウト

1440container
12columns
24pxgutter
768 / 1024breakpoints

大規模な写真が主要な構造要素となるフルブリードのエディトリアルグリッド。最小限のテキストがオーバーレイされる。

07

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

220msmicro
300mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

ホバー時の滑らかな不透明度と色のトランジション、画像とテキストの控えめなスクロールベースのリビール。

インタラクティブ性を示すために、テキストや背景色が変化する滑らかな色のトランジション。 · クリック可能な要素を示す標準ポインターカーソル。

08

コンポーネント

09

文体と禁止事項

10

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

Xxxi Studio — 桌面首屏（hero）
桌面首屏（hero）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Xxxi Studio — 移动首屏
移动首屏

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

11

System Prompt

これは、生の工業素材とミニマリストな実行に焦点を当てた、プレミアム建築スタジオのポートフォリオです。デザインは純白（#FFFFFF）と純黒（#000000）のモノクローパレットに大きく依存し、一貫した400ウェイトの単一のグロテスクサンセリフフォントファミリーを使用しています。主要な制約には、鮮やかなアクセントカラーの回避、重いシャドウや角丸の除外、装飾的なタイポグラフィの使用拒否が含まれます。レイアウトは、最小限のオーバーレイテキストを備えたフルブリードの高品質写真に完全に驱动されています。インタラクションは控えめで、滑らかな0.3秒のトランジションに依存しています。この抑制により、デザインがスタジオの建築作品と競合しないことが保証されます。

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

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

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

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