パルコのデザインシステム／日本語版

DESIGN.md から抽出したデザイントークンのカタログ。純白背景 #ffffff × 濃グレー文字 #2c2c2c × Noto Sans JP（和文）+ Lato（欧文）の二系統フォントで構成された、コーポレート寄りのタイポグラフィ主導 UI。font-feature-settings: "palt" を全要素に適用し、letter-spacing 0.28px (+0.02em) で字間を広げる伝統的な日本企業サイトの典型例。computed style 実測値（2026-05-07 取得）に基づく。

企業情報を見る

01 / Colors

カラーパレット

Surface

Page Background

#ffffff

ページ全体（純白）

Light Gray Surface

#ededed

ページャー背景・補助面

Text

Text Primary

#2c2c2c

本文・見出し（濃グレー）

Text Muted

#646464

日付・キャプション（Lato）

Logo Black

#000000

PARCO ロゴ・純黒

Tag / Border

Tag Background

#707070

「営業関連」等のタグ面

Border (Card)

#dedede

カード罫線

Pager Inactive

#aeaeae

ページャー非アクティブ

02 / Typography — 実測値

タイポグラフィ階層

セクション見出し／お知らせ

30px / 700 / line-height: 1.3 / letter-spacing: 3px (+0.1em) / palt: ONトップページ h2

アクティブナビ／企業情報

16px / 700 / line-height: 1.8 / letter-spacing: 0.28px (+0.02em)グローバルナビ

本文テキスト／パルコは1969年（昭和44年）の池袋進出以降、ファッション・カルチャー・エンタテインメントを軸とした商業施設運営を続けています。コーポレートサイトの本文は line-height 1.8 と広めに取り、palt で約物を詰めて引き締めた組です。

14px / 400 / line-height: 1.8 / letter-spacing: 0.28px / palt: ON本文 p

Date Caption — 2026.01.23 / Lato

12px / 400 / line-height: 1.8 / Lato / color #646464日付（英数字専用）

営業関連

12px / 400 / line-height: 1.8 / 白文字 #fff on 灰色 #707070 / padding 2px 8pxカテゴリタグ

03 / News List — お知らせ一覧

お知らせ

04 / Card Grid — リンクカード

企業情報

05 / Buttons & Tags

UI コンポーネント

詳細を見る

Card Link CTA

営業関連

Tag Badge

IR情報

Tag Badge

Pager (radius 50%)

06 / Forms

フォーム要素

サイト内検索

デフォルト — border: 1px solid #dedede, radius: 0px

メールアドレス

フォーカス — border: #2c2c2c

07 / Spacing — 4px グリッド

スペーシング

XS · 4px

S · 8px

M · 16px

L · 24px

XL · 32px

XXL · 64px

パルコのデザインシステム ／ 日本語版