Diff

Oura vs Alibaba

81 token-level differences between these two design systems.

Role tokens
Background
#000000 #ffffff
Text
#ffffff #222222
Brand
#d6c283 #ff6a00
Border
#262626 #e5e5e5
Display font
Inter PingFang SC
Body size
16px 14px
colors 74 changed
~ bg #000000 #ffffff
~ surface #0d0d0d #ffffff
~ surface-soft #1a1a1a #fafafa
~ surface-strong #262626 #e8e8e8
~ brand #d6c283 #ff6a00
~ brand-hover #c4ae6a #e85f00
~ brand-active #a8924f #cc5400
~ brand-pale #ede4cb #ffe5cc
~ brand-deep #7d6a3d #a64200
~ text #ffffff #222222
~ text-strong #ffffff #000000
~ text-muted #b5b5b5 #666666
~ text-soft #8a8a8a #999999
~ text-faint #666666 #cccccc
~ border #262626 #e5e5e5
~ border-soft #1a1a1a #f0f0f0
~ border-strong #3a3a3a #cccccc
~ shadow-card rgba(0,0,0,0.5) rgba(0,0,0,0.08)
~ success #84d97e #1ca44e
~ warning #d9b67e #f7ba2a
~ danger #d97e84 #d62828
~ info #7eb8d9 #1976d2
+ bg-soft #f5f5f5
+ bg-warm #fff8f0
+ surface-card #ffffff
+ surface-overlay rgba(0,0,0,0.6)
+ bg-dark #1d1d1d
+ text-body #222222
+ text-inverse #ffffff
+ text-link #1976d2
+ text-link-hover #1565c0
+ brand-light #ff8533
+ brand-glow rgba(255,106,0,0.15)
+ on-brand #ffffff
+ accent-gold #f7ba2a
+ accent-gold-dark #c8860a
+ accent-blue #1976d2
+ accent-blue-deep #0d47a1
+ accent-red #d62828
+ accent-red-deep #a91b1b
+ accent-green #1ca44e
+ accent-purple #6a3093
+ border-orange #ff6a00
+ border-card #dddddd
+ shadow-card-hover rgba(0,0,0,0.16)
+ shadow-modal rgba(0,0,0,0.25) 0 8px 24px
+ shadow-orange rgba(255,106,0,0.3)
+ flash-deal-bg linear-gradient(90deg, #ff6a00, #ff8533)
+ flash-deal-pulse rgba(255,106,0,0.6)
+ rfq-ribbon #ff6a00
+ trade-assurance #1976d2
+ verified-mark #1976d2
+ ready-to-ship #1ca44e
+ factory-tag #6a3093
bg-elev #0d0d0d
bg-elev-strong #1a1a1a
bg-light #ffffff
bg-cream #f5f0e6
brand-soft #1a1612
ring-titanium #8a8a8a
ring-rose-gold #c4847a
ring-stealth #3a3a3a
text-on-brand #000000
text-on-light #000000
link #ffffff
link-hover #d6c283
border-input #4d4d4d
score-readiness #84d97e
score-sleep #7eb8d9
score-activity #d9b67e
score-stress #d97e84
score-resilience #9c7ed9
scrim rgba(0,0,0,0.8)
shadow-elev rgba(0,0,0,0.7)
typography 5 changed
~ display {"family":"Inter","size":72} {"family":"PingFang SC","size":72}
~ h1 {"family":"Inter","size":40} {"family":"PingFang SC","size":40}
~ h2 {"family":"Inter","size":32} {"family":"PingFang SC","size":32}
~ body {"family":"Inter","size":16} {"family":"PingFang SC","size":14}
~ label {"family":"Inter","size":11} {"family":"JetBrains Mono","size":11}
radius 2 changed
~ button 8px 4px
~ card 12px 6px
spacing identical
No differences.
↻ Swap direction · Alibaba → Oura