sangetsu
重要なお知らせ 2026.04.13 取引価格改定に関するお知らせ
Joy of Design

デザインするよろこびを

壁はネガティブに語られることがある。その、イメージそのものを変えてみよう。意味を再構築しよう。ひとつの壁が、世界を変えるきっかけになることだってあるのだから。

01 — COLORS

カラーパレット

UI は無彩色に徹し、商品写真とテクスチャに色を譲る。ブランドの無彩色は温かみのあるグレー #727171(純グレーではない)。BtoB 導線だけ紺青 #185f98。多色になるのはお知らせ・IR のカテゴリタグのみで、純赤 #ff0000 は「重要なお知らせ」専用。

Brand Gray
#727171
基幹の無彩色。IR・タブ・ナビ
Business Blue
#185f98
BtoB 導線の CTA
Alert Red
#ff0000
「重要なお知らせ」専用の純赤
Text Primary
#333333
本文
Text Secondary
#666666
淡い見出し
Muted Gray
#9fa0a0
検索ボタン面・非活性
Dark Gray
#686e6e
フッターの導線帯
Surface
#f4f4f4
セクション面
Surface 2
#efefef
薄グレーボタン面
Border
#cccccc
罫・アウトライン
Topics Pink
#f1a1c4
「トピックス」タグ面
Notice Orange
#f9c681
「お知らせ」タグ面
Update Purple
#ba7cb9
「WEBサイト更新情報」タグ面
Showroom Blue
#6e96ce
ショールーム系タグ面
Category Purple
#892890
タブのアクティブ面
IR Green
#739f4c
「サステナビリティ」タグ

02 — TYPOGRAPHY

タイポグラフィ

コーポレートフォントは AXIS Std(タイププロジェクト)。行間 2.0 が本文の基準で、見出しにも原則 2.0 が乗る。リード文と淡い見出しのみ 1.7。letter-spacing / font-feature-settings はともに normal、ウェイトは 400 と 700 の二極。

デザインするよろこびを
Page Title · AXIS Std · 28px · weight 700 · lh 2.0(56px)
Room Styling / 空間から探す
Heading 1 · 24px · weight 700 · lh 1.7 · #666666
壁紙・床材・ファブリック
Heading 2 · 22px · weight 700 · lh 2.0(44px)
商品を探す
Heading 3 · 21px · weight 700 · lh 2.0(42px)
リード文 — その壁はなにを変えるだろう。立ち塞がる一方で、アイデア次第でだれかを笑顔にしたり、日々を明るく変える力を持っているはず。
Lead · 18px · weight 400 · lh 1.7(30.6px)
Joy of Design
Sub Head (EN) · Hind Madurai · 16px · weight 700 · lh 2.0
本文 — サンゲツは 1849 年に名古屋で創業した、インテリア内装材のメーカーです。壁紙、床材、カーテン、椅子生地。空間を構成する「面」の素材を企画し、設計者と暮らす人の双方に届けています。行間 2.0 の広さが、余白の上品さを支えています。
Body · AXIS Std · 14px · weight 400 · lh 2.0(28px) · ls normal
詰めた本文(リスト内) — 行間 1.5。リストや密度の高い領域でのみ使う。
Body Tight · 14px · weight 400 · lh 1.5(21px)
トピックス お知らせ WEBサイト更新情報 大阪ショールーム サステナビリティ 株主総会 適時開示 商品 その他
Category Tag · 12px · weight 400/700 · radius 0 · 面色+白抜き / 白地+同色 1px 枠+同色文字 の 2 形式

03 — ARTICLE

組版サンプル

その壁は、なにを変えるだろう。

壁はネガティブに語られることがあります。立ち塞がるもの、隔てるもの、乗り越えるべきもの。けれどその意味は、少しの工夫で組み替えられるはずです。

面の素材が、空間の性格を決める

壁紙、床材、カーテン、椅子生地。空間を構成しているのは、結局のところ「面」です。面の色と手ざわりが変わるだけで、同じ間取りの部屋がまったく違う表情になります。だからこそ素材の選択肢は多い方がいい、と私たちは考えています。

行間を広く取り、色数を絞る。UI の側が静かであるほど、素材そのものの色柄が前に出てきます。商品を探す


04 — BUTTONS

ボタン

BtoB 導線は紺青 #185f98、企業・IR 導線はブランドグレー #727171。副次は白地+#cccccc の枠、または薄グレー面 #efefef。border-radius は 0 で、角丸やピルは使わない。

ビジネス向けはこちら 株主・個人投資家の皆さまへ 会社情報トップ 一覧を見る
カタログから探す 機能や色・柄から探す イメージから探す

05 — CARDS & LIST

カードとお知らせ

カードは radius 0、罫は #cccccc。お知らせリストは日付・カテゴリタグ・見出しの 3 要素で、タグの色が情報種別を示す。

Room Styling / リビング
壁紙 × 床材のコーディネート
デジタルカタログ
最新の見本帳をオンラインで
ショールーム
実物の質感を確かめる
2026.07.24トピックスSANGETSU DESIGN AWARD 2026 受賞作品・総評を公開しました
2026.07.18お知らせ夏季休業期間のご案内
2026.07.10株主総会定時株主総会 招集ご通知を掲載しました
2026.07.02サステナビリティ統合報告書 2026 を公開しました

06 — FORMS

フォーム

デフォルト / フォーカス / エラーの3状態。radius 0、フォーカスは紺青 #185f98、エラーは #ff0000。

正しい電話番号を入力してください。
送信する

07 — ELEVATION

奥行き

オフセットを持たない「全方位に淡く広がる影」が特徴。0 4px 12px のような落ち影は使わない。奥行きは白 × #f4f4f4 / #efefef の面の差で表現する。

Level 0
none(既定)
Level 1
inset 0 0 4px rgba(0,0,0,.05)
Level 2
0 0 3px 2px #cccccc
Level 3
0 0 5px rgba(0,0,0,.2)

08 — LAYOUT

スペーシング

5 / 10 / 16 / 24 / 40 / 64 / 96px。コンテナは最大 1200px、KV と写真セクションは全幅ブリード。

XS 5
S 10
M 16
L 24
XL 40
XXL 64
XXXL 96