Findyは、一人ひとりの経験や強みを可視化し、活躍できる企業とつなげる、ハイクラス向けのIT転職サービスです。
※1：2026年9月時点 ※2：2026年1〜6月実績
デザインシステムのプライマリは --fcds-color-main: #155aa8（CSS 全文で 159 回）。一方、トップの LP だけ #0d69d2（40 回 / 可視 164 要素）を使っていて、この色はトークンに存在しない。上のヒーローが #0d69d2、ヘッダーの「新規登録」が #155aa8。青を 1 色に統一しない。
FCDS は blue grey green orange purple red yellow の 7 系統を 50 / 100 / 200 … 900 の 10 段階で持っている。中間色を自分で作らない。
alphaGrey-* / alphaBlue-* / black-* / white-* の半透明ランプも各 10 段階ある。写真の上に文字や面を置くときはこちらを使う。
--rt-*（react-tooltip・10 個）と --agentation-*（7 個）はサードパーティのトークン。抽出では合計 209 個と出るが、設計値として読むのは --fcds-* の 192 個だけ。
可視 531 要素のうち 419 要素が weight 700。ナビもタグも年収も見出しも太字で、Regular(400) の方が例外（52 要素）。そして下層は 531 要素すべて letter-spacing: normal。字間で整えず、weight と line-height だけで階層を作る。
font: ショートハンド 1 本で組める| Token | 値 | 用途 |
|---|---|---|
--fcds-typography-heading-4xl | 700 64px/1.25 | 最大見出し |
--fcds-typography-heading-3xl | 700 40px/1.25 | LP のセクション見出し |
--fcds-typography-heading-xxl | 700 32px/1.5 | ページタイトル |
--fcds-typography-heading-xl | 700 24px/1.5 | 一覧見出し |
--fcds-typography-heading-l / m / s | 700 18 / 16 / 14px ×1.5 | カード見出し・小見出し |
--fcds-typography-text-body-{l,m,s,xs}-{bold,regular} | 700・400 18 / 16 / 14 / 12px ×1.5 | UI テキスト |
--fcds-typography-text-body-xxs-* | 700・400 10px/1.25 | 注記 |
--fcds-typography-text-article-{l,m}-* | 700・400 18 / 16px ×1.75 | 記事だけ行間 1.75 |
行間は 4 つだけ（--fcds-line-height-100 / 125 / 150 / 175 = 1 / 1.25 / 1.5 / 1.75）。1.6 や 1.7 を作らない。UI は 1.5（可視 433 要素）、記事は 1.75、1 行で収めるラベルは 1（241 要素）。
ロードされている Noto Sans JP は 400 と 700 だけ。実サイトは下層の職種リストに weight: 300、LP のリード文に 500 を指定しているが、どちらも @font-face が無い＝描画されていない指定。--fcds-font-weight-* にも 400 と 700 しか無い。
Rubik も同様。5 要素に指定されているが @font-face が無く、system-ui に落ちる。Rubik を前提に組まないこと。
font-feature-settings: "palt" は 1 要素も使っていない（CSS 全文でも 0 回）。年収の桁揃えに tnum も使わず、レイアウト側で揃えている。
条件タグ（フルリモート可）の 1px 枠は border ではなく box-shadow: inset 0 0 0 1px（可視 26 要素）。枠をレイアウトの寸法に影響させないための実装。
s が無く xs(12px) の次が m(16px)。トークン名を勝手に補完しない。
影の色が 2 系統ある。サービス側は黒寄り（rgba(44,40,40,.11)）、LP 側は青みがかったグレー（rgba(201,210,220,.2〜.3)）で、下に大きくぼかす。
コンテナは LP 1080px / サービス画面 1200px。ブレークポイントは Bootstrap 由来の max-width: 767.98px（243 回）と自前の min-width: 768px（108 回）が主。.98 は慣習を引き継いだものなので、新設しない。