厳選・オープン・無料
V A C
文化施設のプロジェクトやイベントのための、ミニマルなデジタルカタログ。
EditorialGalleryTypographyCurationClean
01
デザイン DNA
文化的エディトリアルミニマル展覧会ギャラリー
デジタル展覧会カタログ
02
カラー
#000000Ink
#FFFFFFBG
#F1F1F1BG quiet
#999999Muted
rgba(0, 0, 0, 1)Line
黒と白を厳格に使用するモノクローム。グレーはセカンダリ要素やプレースホルダーにのみ使用。
03
タイポグラフィ
geometric-sans · humanist-sans
- display
34px · 400 - body
20px · 400 - small
16px · 400
タイトルにはレギュラーウェイトとイタリック体のセカンダリテキストを組み合わせる · 見出しはインライン高を詰め、コンパクトなブロックを形成する · すべてのタイポグラフィはウェイト400を使用する
04
余白
4px
8px
16px
20px
24px
32px
48px
64px
96px
コンテンツブロック間に十分な垂直方向の余白を設け、リズム感のあるエディトリアルなフローを生む。
05
サーフェス (角丸 / 影 / 罫線)
sm · 0px
md · 0px
lg · 0px
pill · 999px
トップナビゲーションや区切り線として、1pxの細い黒い実線を構造的に使用。
06
レイアウト
1440container
3columns
20pxgutter
768 / 1024breakpoints
アイテムが動的に配置され、垂直位置が vary する非対称グリッドレイアウト。
07
モーションとインタラクション
200msmicro
250mssmall
800msmedium
cubic-bezier(0.4, 0.0, 0.2, 1)easing
hover時の滑らかな色の変化 · インタラクティブ要素のopacityフェード
インタラクティビティを示すために、hover時にテキスト色やopacityがわずかに変化 · イベントやプロジェクトの詳細ページへ直接ナビゲーション
08
コンポーネント
- button 対角線の矢印アイコンを持つプレーンテキストリンクを、プライマリインタラクティブ要素として使用
- card 上部にタイムスタンプ、中央にメディア、下部にタイトルを配置した、メディア多めのイベントカード
- hero 施設名をレイアウトにまたがって配置した、タイポグラフィ中心のスターキーヒーローセクション
09
文体と禁止事項
- トーン 権威があり、簡潔で、組織的
- 見出し 短く、記述的なタイトルに、しばしばイタリック体のサブタイトルや日付が添えられる
- CTA 目立つボタンスタイルを避けた、控えめなテキストベースのリンク
- ドロップシャドウを使用しない — スクリーンショットには奥行き効果を一切持たない完全にフラットなデザインが示されている
- コンテナに角丸を使用しない — スクリーンショットには鋭い矩形要素が示されている
- 鮮やかなアクセントカラーを追加しない — スクリーンショットには厳格なモノクロームデザインが示されている
- 複数のフォントウェイトを使用しない — スクリーンショットには統一されたウェイト400が全体に使われている
- カードに太いボーダーを使用しない — スクリーンショットにはボーダレスなコンテンツブロックが示されている
- カラム内でテキストを中央揃えにしない — スクリーンショットには左揃えのタイポグラフィが示されている
- 避ける: 過度に宣伝的な言葉遣い
- 避ける: 絵文字や装飾要素の乱用
- 避ける: コンテンツから注意をそらす複雑なUIパターン
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
文化施設のデジタルカタログのための、ミニマルでエディトリアルなデザインシステム。厳格なモノクロームパレット(白#FFFFFFに黒#000000)を採用し、統一されたウェイト400の幾何学的サンセリフおよびヒューマニストサンセリフタイポグラフィを使用。レイアウトは非対称でグリッドベースであり、十分な余白と1pxの細い線に依存して構造を形成。主要なインタラクションは、微細なopacityと色の変化を伴う。重要な禁止事項:ドロップシャドウ、角丸、鮮やかなカラー、複数のフォントウェイト、太いボーダー、中央揃えテキストは回避すること。
en · zh-CN · zh-TW · ja · ko