Spice Factory Design System
v0.1 / Phase 2
Spice Factory Inc. のメディア横断スタイルガイド(Foundation 層)。Web / ドキュメント / スライド / 印刷物 へ展開可能な単一情報源として整備中。
実装は tokens.json (GitHub)(DTCG v2025.10)と同期。
原典は 公式ブランドガイドライン PDF(2020年4月版)。
Brand identity
ロゴと、ブランド表記(Cormorant Garamond)・タグラインの 2 系統で構成。
Typography
欧文 Display = Cormorant Garamond、日本語見出し・エディトリアル本文 = Zen Old Mincho、日本語標準本文 = Noto Sans JP。
Color
ブランド色 3 色 + 2 スケール(Mustard Yellow / Gray)+ Semantic 層。
Spacing
4px ベース・13 段階。Tailwind 互換の番号付け。
Radius
「直線と完全円」の二項。面は直角、ボタンとピル要素は完全円。
Elevation
階層は surface(背景色階調)で表現。shadow は浮遊要素のみ最小限。
Border
罫線レベルで使う。面の囲いには強い border を使わず、階層は surface で表現。