THE GUIDE TO A BETTER LIFE

&Premium Design System

DESIGN.md から抽出したデザイントークンのカタログ。白×黒のミニマルな雑誌レイアウト、Montserrat ＋游ゴシック Light、サイト全域 palt。computed style 実測値（2026-06-27）に基づく。

MAIL MAGAZINE 登録 VIEW MORE

01 / COLORS

Color Palette

Brand / Core

Text Primary

#000000

見出し・本文・ナビ

Text Secondary

#2a2a2a

補足・キャプション

Background

#ffffff

ページ背景

Pastel Section Tints

Pastel Blue

#eaeef9

Pick Up セクション地

Pastel Yellow

#fdf8ce

Recommend セクション地

Pastel Green

#d9e0d8

Column セクション地

Soft Grey

#f5f5f5

Mail Magazine 等

Button Grey

#e1e1e1

淡いボタン地

MOOK Grey

#c0c7cd

入力罫線・面色

Neutral / Dark

Dark Button

#2b2b2b

塗りボタン地

Input Text

#282828

入力テキスト

Pastel Sections（地色で性格づけ）

Pick Up

注目の記事

Recommend

連載一覧

Column

連載コラム

Mail Magazine

メルマガ登録

02 / TYPOGRAPHY — 実測値

Typography

A Guide to a Better Life — 大見出し

Montserrat / 32px / 700 / line-height: 1.0 / letter-spacing: -0.03em / #000

FOOD & TRAVEL — サブ見出し

Montserrat / 18px / 700 / line-height: 1.4 / #000

LIFESTYLE / FASHION / BEAUTY — Category Label

Montserrat / 14px / 700 / line-height: 1.4 / letter-spacing: 0.036em (0.5px) / palt / #000

本文テキスト — &Premium はマガジンハウスが発行するライフスタイル誌です。本文は游ゴシック Light(300)、17.6px・line-height 1.8 とゆったり軽く組みます。サイト全域に palt を適用し、字面を上質に整えます。ABCabc 123

游ゴシック / 17.6px (1.1rem) / 300 / line-height: 1.8 / normal / palt / #000

補足・キャプション — 写真の説明や補足はやや小さく、color #2a2a2a で組みます。

游ゴシック / 13px / 300 / line-height: 1.7 / #2a2a2a

MAIL MAGAZINE 登録 — Button Label

Montserrat / 12px / 500 / line-height: 1.4 / letter-spacing: 0.083em (1px)

CREATOR LIST — Micro Label

Montserrat / 9px / 300 / line-height: 1.6 / #000

03 / BUTTONS

Buttons

MAIL MAGAZINE 登録

Dark Solid（#2b2b2b）

Soft Grey（#e1e1e1）

Text Link（基本形）

04 / CARDS — Editorial Article

Cards

FOOD

京都の朝食、選りすぐりの15軒。早起きして向かいたい名店ガイド。

2026.06.24

TRAVEL

静けさを旅する。週末に訪れたい、海辺の小さな宿。

2026.06.20

INTERIOR

暮らしを整える、北欧ヴィンテージの椅子。

2026.06.12