DOCUMENT · 1.2 KB
docs/color-system.md
Workspace snapshot · 08/31 23:51
AI Landing Page Studio — Color System v0.3
Direction
- Strategic clarity 50% — 白と黒で制作判断の階層を明確にする。
- Creative momentum 30% — Orange / Blueの高彩度コントラストで生成と編集の速度を見せる。
- Feedback signals 20% — Yellow / Greenは意味のある小面積の状態表示に限定する。
Role tokens
| Role | Value | Usage |
|---|---|---|
| Ink | #0A0A0B | 主文字、制作Rail、レビュー空間 |
| White | #FFFFFF | 主キャンバス |
| Cloud | #F3F4F6 | 入力面、カード階層、作業背景 |
| Action | #FF4F00 | 生成価値、主要な視覚アクセント、大見出し |
| System | #2447FF | 選択、進行、リンク、主要CTA |
| Attention | #FFD928 | 数字、注意、視線誘導 |
| Success | #23D18B | 保存、完了、品質ゲート |
通常文字は Ink / White または White / System を基本とする。Orangeは白地の小さな本文には使わず、大見出し・図形・状態の補助に限定する。色だけで意味を伝えず、ラベル・形・位置を必ず併用する。
旧v0.2のPaper / Copper構成は、制作ツールとして速度と鮮明さが弱いため廃止した。