Diff

Adidas vs Alibaba

77 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#000000 #222222
Brand
#000000 #ff6a00
Border
#cccccc #e5e5e5
Display font
adidasFG PingFang SC
Body size
16px 14px
colors 70 changed
~ surface-soft #f5f5f5 #fafafa
~ surface-strong #ececec #e8e8e8
~ brand #000000 #ff6a00
~ brand-hover #1d1d1d #e85f00
~ brand-active #3c3c3c #cc5400
~ text #000000 #222222
~ text-muted #767677 #666666
~ text-soft #a8a8a8 #999999
~ border #cccccc #e5e5e5
~ border-soft #ececec #f0f0f0
~ border-strong #000000 #cccccc
~ shadow-card rgba(0,0,0,0.06) rgba(0,0,0,0.08)
~ shadow-modal rgba(0,0,0,0.20) rgba(0,0,0,0.25) 0 8px 24px
~ success #1a8917 #1ca44e
~ warning #bd5c00 #f7ba2a
~ danger #c12121 #d62828
~ info #0064d2 #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-faint #cccccc
+ text-inverse #ffffff
+ text-link #1976d2
+ text-link-hover #1565c0
+ brand-deep #a64200
+ brand-light #ff8533
+ brand-pale #ffe5cc
+ 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-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-page #ffffff
bg-inverse #000000
surface-grey #767677
surface-dark #1d1d1d
brand-on-dark #ffffff
trefoil-red #e32b2b
sale-red #e32b2b
text-on-black #ffffff
text-on-cta #ffffff
link #000000
link-hover #000000
link-underline currentColor
border-input #000000
border-divider #000000
outline-focus #000000
scrim rgba(0,0,0,0.7)
warning-soft #fff4e5
rating-fill #000000
rating-empty #cccccc
typography 5 changed
~ display {"family":"adidasFG","size":72} {"family":"PingFang SC","size":72}
~ h1 {"family":"adidasFG","size":40} {"family":"PingFang SC","size":40}
~ h2 {"family":"adidasFG","size":32} {"family":"PingFang SC","size":32}
~ body {"family":"AdihausDIN","size":16} {"family":"PingFang SC","size":14}
~ label {"family":"Monaco","size":11} {"family":"JetBrains Mono","size":11}
radius 2 changed
~ button 0px 4px
~ card 0px 6px
spacing identical
No differences.
↻ Swap direction · Alibaba → Adidas