Design System Audit · Stripe
Stripe Design System
562KB Source · Lab Sample · 2026.02.13
Audit 003
#DesignSystem
#MeshGradient
#Glassmorphism
Brand Palette
从 562KB 源码中提取的原生基因序列。
--stripe-primary: #FF6201;
--stripe-bg: #181818;
Mesh Gradient
background: radial-gradient(circle at 20% 30%, rgba(255, 98, 1, 0.8), transparent 50%),
radial-gradient(circle at 80% 70%, rgba(135, 62, 255, 0.8), transparent 50%);
Motion DNA
transition: all 0.2s ease-out;
animation: fluid 20s ease-in-out infinite;
- 200ms — 人眼感知与速度的甜蜜点
- ease-out — 开始快、结束慢的收敛感
- bezier(0.4, 0, 0.2, 1) — 更极致的控制
The Formula