Mori Art Museum / 53F Roppongi Hills Mori Tower JP EN CH KR
展覧会 教育普及 パブリック 来館案内
MORI ART MUSEUM 森美術館
アクセス ニュース チケットの購入
DESIGN SYSTEM PREVIEW

森美術館のデザインシステム
クリムゾン #bf0d3e と整然とした構造

2026.5.8 / 実測ベース

森美術館（mori.art.museum/jp）から抽出したデザイントークンのカタログ。Hiragino Sans + クリムゾン #bf0d3e を中心とした美術館サイトの設計。実サイトの computed style 実測値に基づく。

01 / COLORS

カラーパレット

無彩色のキャンバスにクリムゾンを点在させる、美術館サイトの色設計。

BRAND
Mori Crimson
#bf0d3e
ブランド・見出し・CTA・タグ
FOREGROUND
Body Black
#252525
本文・h1〜h3
Mid Gray
#4c4c4c
補助・ナビ補助
Soft Gray
#7f7f7f
キャプション・date
Strong BG
#333333
ヘッダー暗色帯
SURFACE
Pure White
#ffffff
本体・モーダル
Page Surface
#f8f8f8
セカンダリナビ
Section Surface
#f5f5f5
セクション帯
Tag Surface
#ebebeb
タグ・バッジ（出現 12）
02 / TYPOGRAPHY — 実測値

タイポグラフィ

Hiragino Sans + Hiragino Kaku Gothic ProN + メイリオの教科書的なチェーン。本文 line-height は 1.75 と広め。

M
MoriLogoB / 48px / 400 / line-height: 1.0 / color #bf0d3eLOGO (custom)
展覧会のお知らせ
Hiragino Sans / 27px / 700 / line-height: 1.5 (40.5px)H1 HERO
ロン・ミュエク 2026.4.2 — 9.23
Hiragino Sans / 18px / 700 / line-height: 1.0 / color #bf0d3eSTRONG CRIMSON
来館のご案内・チケット情報
Hiragino Sans / 15px / 700 / line-height: 1.5 (22.5px)H2 SECTION
森美術館は六本木ヒルズ森タワー 53 階に位置する現代アートを専門とする美術館です。1997 年の構想を経て 2003 年にオープン。「現代性」「国際性」を二大コンセプトに、独自のテーマで構成された企画展、教育普及プログラム、講演会など多角的な活動を展開しています。
Hiragino Sans / 15px / 400 / line-height: 1.75 (26.25px) / color #252525BODY 標準
2026.4.2 [WED] — 9.23 [SUN]
Hiragino Sans / 13px / 700 / line-height: 1.4 / color #bf0d3eDATE LABEL
展覧会関連 スクール シンポジウム アーティスト・トーク
Hiragino Sans / 11px / 700 / line-height: 2.0 (22.75px) / color #bf0d3e / bg #ebebebTAG / BADGE
参加受付中
Hiragino Sans / 13px / 700 / line-height: 1.0 / color #ffffff / bg #bf0d3eFILLED BADGE
＊本記事は森美術館の公式情報をもとにレイアウトサンプルとして作成したものです。
Hiragino Sans / 11px / 400 / line-height: 1.75 (19.25px) / color #7f7f7fFOOTER NOTE
HOME > 展覧会 > 開催中の展覧会 > 詳細
Hiragino Sans / 10px / 400 / line-height: 2.0 / color #4c4c4cCAPTION
03 / EXHIBITIONS — 開催スケジュール

開催中・近日開催

展覧会カードはクリムゾンの日付ラベルで識別。タグで関連プログラムを表示。

開催中
2026.4.2 [WED] — 9.23 [SUN]

ロン・ミュエク 個展

圧倒的なリアリズムで描く、人間の存在
展覧会関連 アーティスト・トーク
2026.10.15 [THU] — 2027.3.20 [SUN]

ニュー・テクノロジーと身体

人工知能・仮想空間と現代美術の交差点
展覧会関連 シンポジウム スクール
2027.5.10 [MON] — 9.30 [WED]

アジアの現代写真

アジア各地の写真表現を一望する大規模展
展覧会関連 教育プログラム
PUBLIC PROGRAM
トーク・教育普及プログラム
展覧会に関連するアーティスト・トーク、シンポジウム、ファミリープログラム、ナイトトークなど、多様な公開プログラムを開催しています。
プログラムを見る
04 / BUTTONS

ボタンの種類

来館のご案内
PRIMARY (Outline)
白塗 + クリムゾン文字 + radius 5px
チケットの購入
SECONDARY (Filled)
クリムゾン塗 + 白文字 + radius 5px
スクール
TAG / FILTER
11px weight 700 / radius 0
参加受付中
FILLED BADGE
13px / クリムゾン背景
05 / FORMS

入会・お問い合わせ

DEFAULT — border #cccccc / radius 5px
FOCUS — border #bf0d3e
ERROR — border + bg tint
06 / ELEVATION & SURFACE

面の重なり（影なし）

森美術館は影を使わず、サーフェス色の濃淡で領域を分ける。クリムゾンのアクセントだけが目線を集める。

Pure White
#ffffff
Page Surface
#f8f8f8
Section Surface
#f5f5f5
Tag Surface
#ebebeb
Strong BG
#333333
Mori Crimson
#bf0d3e
07 / LAYOUT — SPACING

余白のスケール

XS
4px
S
8px
M
16px
L
24px
XL
40px
XXL
64px