Adobe Spectrum

Spectrum CSS · 创意工具美学 · 2026.02.16

40+
Components
30+
Tokens
4
Scales
Design Tokens

Spectrum 采用蓝色为主调,6 种色相 × 多种饱和度,精确色彩系统。

:root {
  --spectrum-blue: #1473E6;
  --spectrum-fuchsia: #D83790;
  --spectrum-red: #E24800;
  --spectrum-green: #05AC00;
}
#147
#5E7
#D83
#C72
#E24
#05A
Responsive Grid

4 种尺寸系统:S / M / L / XL,覆盖不同设备和使用场景。

$spectrum-scale-medium: default;
$spectrum-scale-large: express;
$spectrum-breakpoint: 1120px;
S
M
L
XL
Typography
  • Font: Adobe Clean — 创意工具定制
  • Scale: 11/13/14/15/16/18/20/24/31/40px
  • Weight: Regular / Medium / Semibold
  • Focus: 键盘导航优先
The Formula

Spectrum = Precision × Empathy × Craft

频谱 = 精确 × 同理 × 匠心