Diff

Uber Eats vs Twitch

85 token-level differences between these two design systems.

Role tokens
Background
#ffffff #0e0e10
Text
#000000 #efeff1
Brand
#000000 #9146ff
Border
#eeeeee #3a3a3d
Display font
Uber Move Inter
Body size
16px 14px
colors 78 changed
~ bg #ffffff #0e0e10
~ surface #ffffff #1f1f23
~ surface-soft #f6f6f6 #18181b
~ surface-strong #eeeeee #26262c
~ brand #000000 #9146ff
~ brand-hover #1f1f1f #a970ff
~ brand-active #3d3d3d #772ce8
~ text #000000 #efeff1
~ text-strong #000000 #ffffff
~ text-muted #545454 #898997
~ text-disabled #aaaaaa #53535f
~ border #eeeeee #3a3a3d
~ border-soft #f6f6f6 #26262c
~ border-strong #cccccc #53535f
~ shadow-card rgba(0,0,0,0.08) rgba(0,0,0,0.5)
~ success #06c167 #00f593
~ warning #ffc043 #ffd84a
~ danger #e11900 #eb0400
~ info #276ef1 #4d8eff
+ bg-alt #18181b
+ bg-deep #000000
+ surface-elevated #26262c
+ surface-card #1f1f23
+ surface-chat #1f1f23
+ surface-chat-hover #26262c
+ text-base #efeff1
+ text-alt #adadb8
+ text-link #bf94ff
+ brand-deep #5c16c5
+ brand-2024 #9146ff
+ brand-classic #6441a4
+ on-brand #ffffff
+ accent-magenta #fab4ff
+ accent-cheer-red #ff4248
+ accent-cheer-orange #f5b53a
+ accent-cheer-blue #4d8eff
+ accent-cheer-green #00d6cc
+ accent-cheer-purple #9c3eff
+ scrim-card linear-gradient(0deg, rgba(0,0,0,0.85) 0%, transparent 100%)
+ shadow-modal rgba(0,0,0,0.76)
+ danger-text #ff4d4d
+ live-indicator #eb0400
+ live-pill-bg #eb0400
+ follow-purple #9146ff
+ subscribe-tier-1 #9146ff
+ subscribe-tier-2 #3ea6f5
+ subscribe-tier-3 #f5b53a
+ highlight-mod #00ad03
+ highlight-vip #e005b9
+ highlight-broadcaster #eb0400
+ highlight-prime #3ea6f5
bg-page #ffffff
surface-cream #f7f5f2
surface-input #f6f6f6
brand-pale #cccccc
brand-text-on #ffffff
text-soft #757575
text-inverse #ffffff
link #000000
link-hover #000000
border-input #cccccc
border-card transparent
star-fill #000000
star-empty #cccccc
uberone-green #06c167
uberone-bg #000000
uberone-text #ffffff
free-delivery-green #06c167
promo-pink #cae0bc
bestseller-bg #f6f6f6
bestseller-text #000000
scrim rgba(0,0,0,0.6)
shadow-elev rgba(0,0,0,0.18)
shadow-deep rgba(0,0,0,0.24)
success-soft #e6f9ee
warning-soft #fff8e6
danger-soft #fde8e6
info-soft #e8efff
typography 5 changed
~ display {"family":"Uber Move","size":72} {"family":"Inter","size":72}
~ h1 {"family":"Uber Move","size":40} {"family":"Inter","size":40}
~ h2 {"family":"Uber Move","size":32} {"family":"Inter","size":32}
~ body {"family":"Uber Move Text","size":16} {"family":"Inter","size":14}
~ label {"family":"Uber Move Mono","size":11} {"family":"Roboto Mono","size":11}
radius 2 changed
~ button 8px 6px
~ card 12px 8px
spacing identical
No differences.
↻ Swap direction · Twitch → Uber Eats