Diff

Ferrari vs Uber Eats

75 token-level differences between these two design systems.

Role tokens
Background
#181818 #ffffff
Text
#ffffff #000000
Brand
#da291c #000000
Border
#303030 #eeeeee
Display font
FerrariSans Uber Move
Body size
14px 16px
colors 65 changed
~ bg #181818 #ffffff
~ surface #303030 #ffffff
~ text #ffffff #000000
~ text-strong #ffffff #000000
~ text-muted #666666 #545454
~ brand #da291c #000000
~ brand-active #b01e0a #3d3d3d
~ brand-hover #9d2211 #1f1f1f
~ border #303030 #eeeeee
~ border-soft #ebebeb #f6f6f6
~ link #ffffff #000000
~ link-hover #da291c #000000
~ success #03904a #06c167
~ warning #f13a2c #ffc043
~ info #4c98b9 #276ef1
~ danger #f13a2c #e11900
+ bg-page #ffffff
+ surface-soft #f6f6f6
+ surface-strong #eeeeee
+ surface-cream #f7f5f2
+ surface-input #f6f6f6
+ brand-pale #cccccc
+ brand-text-on #ffffff
+ text-soft #757575
+ text-disabled #aaaaaa
+ text-inverse #ffffff
+ border-strong #cccccc
+ 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-card rgba(0,0,0,0.08)
+ 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
bg-campaign #000000
surface-card #303030
surface-soft-light #f7f7f7
surface-strong-light #ebebeb
surface-light #ffffff
text-body #969696
text-on-light #181818
text-muted-soft #8f8f8f
brand-gradient-top #a00c01
accent-yellow-hypersail #fff200
accent-yellow #f6e500
on-brand #ffffff
on-light #181818
on-photo #ffffff
border-on-light #d2d2d2
ring #f6e500
promo-red #da291c
gradient-dark-top #3c3c3c
gradient-dark-bottom #030303
typography 5 changed
~ display {"family":"FerrariSans","size":72} {"family":"Uber Move","size":72}
~ h1 {"family":"FerrariSans","size":40} {"family":"Uber Move","size":40}
~ h2 {"family":"FerrariSans","size":32} {"family":"Uber Move","size":32}
~ body {"family":"FerrariSans","size":14} {"family":"Uber Move Text","size":16}
~ label {"family":"JetBrains Mono","size":11} {"family":"Uber Move Mono","size":11}
radius 2 changed
~ button 6px 8px
~ card 8px 12px
spacing 3 changed
~ md 24px 16px
~ lg 64px 32px
~ xl 128px 48px
↻ Swap direction · Uber Eats → Ferrari