厳選・オープン・無料

New Museum

高電圧のカラーブロックとオーバーサイズのディスプレイタイポグラフィを用いた、大胆なコンテンポラリーアート美術館のサイト。

museumart
New Museum のスクリーンショット
↓ デザインシステムをダウンロード (41 MB)OpenDesign で開く

オリジナル: https://www.newmuseum.org

📦 パックの中身を見る →

01

デザイン DNA

アバンガードコンテンポラリーアート文化的機関大胆革新的

制度的実験のための、アグレッシブなライムグリーンのキャンバス。

02

カラー

#BEFF00Accent
#0A4B50Ink
#E5E7EBMuted
rgba(10, 75, 80, 1)Line

高電圧のアシッドグリーンと深いティールを組み合わせ、最大限の視覚的緊張感を生み出します。

03

タイポグラフィ

grotesque-sans · geometric-sans

ディスプレイフォント（Neographik）は、巨大なセクション見出しとロゴのみに使用。 · 本文フォント（Akkurat）は、ナビゲーション、イベント情報、標準的なコピーに使用。 · ディスプレイテキストには、密度の高い建築的な印象のために、 tightenされた字間を維持。

04

余白

4px
8px
12px
16px
24px
32px
40px
48px
96px
120px

巨大なタイポグラフィと画像ブロックの周囲にたっぷりとホワイトスペースを配置し、大胆なカラーが息めるように。

05

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

sm · 4px
md · 6px
lg · 9999px
pill · 9999px

ボーダーの使用は最小限に留め、カラーブロックはソリッドな背景の遷移で定義。

06

レイアウト

1440container
12columns
24pxgutter
768 / 1024breakpoints

フル幅のカラーブロック内に、イベントやビデオカードのための4カラムグリッドレイアウトを配置。

07

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

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

カラーや背景の変化に対するスムーズなトランジション。 · インタラクティブ要素の微細な不透明度フェード。 · 画像表示のためのclip-pathアニメーション。

ナビゲーションリンクのカラーシフトと、インタラクティブ要素の微細な不透明度の変化。 · スムーズなマイクロインタラクションによる即座のビジュアルフィードバック。

08

コンポーネント

09

文体と禁止事項

10

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

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

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

11

System Prompt

大胆なコンテンポラリーアート文化機関のウェブサイトをデザイン。プライマリ背景に高電圧アシッドグリーン（#BEFF00）、プライマリテキストおよびダークセクションに深いティール（#0A4B50）を使用。タイポグラフィは、tightな字間を持つ太字大文字のグロテスクサンセリフを巨大なディスプレイ見出しに、本文にはクリーンなジオメトリックサンセリフを組み合わせる。レイアウトはフルブリードでグリッドベース、高品質な写真またはビデオの上にオーバーサイズのテキストオーバーレイを配置。重要：微細なカラーまたは伝統的なセリフは絶対に使用せず、丸みのあるコンテナやドロップシャドウを避け、テキストは大きく、太字で、躊躇なく表示すること。

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

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

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

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