RS Design System v2 · Foundation
OKLCH · light/dark · DTCG → Style Dictionary

REMOSELL Design System v2 — 個性①「計器盤の誠実」

アポを“取る”で
終わらせない。

現場の信頼できる道具・透明な計器盤。叫ばず、数字で語り、再現性で信頼される——それが RS の顔。
署名 = 数値が主役(mono tabular)+ the teal rule(3px)。逃げる色 = deep teal(generic blue でない)。

週次レポート WEEK 12 · 06/22
商談獲得
14 /12
▲ 目標比 117%
成功率
8.6%
▲ +2.1
拒否理由
予算・時期42%
決裁者不在31%

↓ 以下は すべて design token 駆動(OKLCH / DTCG / Style Dictionary / WCAG 2.2 AA 自動検査 / light·dark)。

ブランドの魂(DNA)— なぜ・どう感じさせるか

token の上位にある「魂」。これが定義されて初めて DS は個性を持つ(詳細 = DESIGN.md)。

5 原則
  1. 数値が主役 — 透明性は数字で語る(mono tabular)
  2. 叫ばない — border-first・装飾禁止
  3. 道具であって玩具でない — sharp・絵文字禁止
  4. 単一の所作 — the teal rule(3px)
  5. 飾りのための美を禁ず — 全視覚に目的
Personality
誠実硬質静か道具的透明
らしくない: 派手 / 攻撃的 / 可愛い / 装飾的 / 曖昧
署名 (One Bold Move)
数値の計器盤 + the teal rule
逃げる色 = deep teal(B2B 支配色の generic blue でない)。全接点で反復。

カラー — OKLCH ramp

主役 teal(ブランド資産)+ cool gray(faint teal undertone)+ semantic。明度を知覚均等に刻むので、テーマ/ホバーを式で生成できる。

Teal(primary)
Gray(neutral · cool)
Semantic(success · warning · danger · info)

サーフェス・ボタン・状態

Buttons(the teal rule = 単一アクセント)
Status(色+ラベル+ドット)
受注商談中 失注
今週の商談獲得 14 / 12 ▲ 目標比 117%
成功率 8.6%▲ +2.1

運用テーブル(高密度・44px 行・数値 tabular)

企業ステータス架電アポ率
オリックス・リビング商談中1289.4%
みやび冷熱工業受注8611.6%
宏和エンジニアリング545.2%

タイポグラフィ — ops(密)と 表現面(大型 display)

display-lg受注が起きる商談
4xl / 38章扉の見出し
2xl / 24セクション見出し
md / 16Web 本文。IBM Plex Sans JP で和文も同family。
base / 14ops UI 既定の高密度本文。
mono tabular¥2,550,000 ・ 88,166 社 ・ 117%

モーション(token 駆動・hover で確認)

duration / easing をトークン化。prefers-reduced-motion で自動的に 0 へ(前庭障害配慮)。

base 200ms / emphasized
fast 140ms / ease-out

Component Kit(再利用層・components.css

トークンを消費する再利用コンポーネント。全 surface(ops/LP/資料)がこの kit を着せ替えて使う。light/dark 両対応。

概況
企業
設定
企業状態架電アポ率
オリックス・リビング商談中1289.4%
みやび冷熱工業受注8611.6%
宏和エンジニアリング要対応545.2%