Diff

Coinbase vs Revolut

56 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#0a0b0d #191c1f
Brand
#0052ff #191c1f
Border
#dee1e6 #e2e4e6
Display font
Coinbase Display Aeonik Pro
Body size
16px 16px
colors 48 changed
~ bg-dark #0a0b0d #191c1f
~ text #0a0b0d #191c1f
~ text-body #5b616e #3a3f44
~ text-muted #7c828a #5f676e
~ text-subtle #a8acb3 #8d969e
~ brand #0052ff #191c1f
~ border #dee1e6 #e2e4e6
~ border-soft #eef0f3 #f0f1f2
~ focus-ring rgba(0,82,255,0.30) rgba(95, 67, 255, 0.55)
+ bg-dark-deep #0e1013
+ surface #ffffff
+ surface-subtle #f7f7f8
+ surface-muted #eff0f1
+ surface-dark #23272b
+ surface-dark-2 #2d3237
+ text-on-dark #ffffff
+ text-on-dark-muted rgba(255, 255, 255, 0.72)
+ text-on-dark-subtle rgba(255, 255, 255, 0.48)
+ brand-on-dark #ffffff
+ accent #5f43ff
+ accent-blue #2868ff
+ accent-pink #ff4d97
+ accent-soft rgba(95, 67, 255, 0.10)
+ on-brand-light #191c1f
+ link #191c1f
+ link-accent #5f43ff
+ link-on-dark #ffffff
+ border-strong #c9cdd1
+ border-on-dark rgba(255, 255, 255, 0.16)
+ semantic-success #1f8f4e
+ semantic-warning #c77700
+ semantic-danger #d92d20
+ semantic-info #2868ff
+ shadow-ambient rgba(16, 18, 21, 0.06)
+ shadow-soft rgba(16, 18, 21, 0.10)
+ shadow-standard rgba(16, 18, 21, 0.14)
+ shadow-elevated rgba(16, 18, 21, 0.20)
surface-soft #f7f7f7
surface-strong #eef0f3
surface-card #ffffff
surface-dark-elevated #16181c
brand-active #003ecc
brand-disabled #a8b8cc
on-dark #ffffff
on-dark-soft #a8acb3
semantic-up #05b169
semantic-down #cf202f
accent-yellow #f4b000
typography 5 changed
~ display {"family":"Coinbase Display","size":72} {"family":"Aeonik Pro","size":86}
~ h1 {"family":"Coinbase Display","size":40} {"family":"Aeonik Pro","size":40}
~ h2 {"family":"Coinbase Display","size":32} {"family":"Aeonik Pro","size":32}
~ body {"family":"Coinbase Sans","size":16} {"family":"Inter","size":16}
~ label {"family":"Coinbase Mono","size":11} {"family":"SFMono-Regular","size":13}
radius 3 changed
~ button 12px 8px
~ card 16px 12px
~ pill 100px 9999px
spacing identical
No differences.
↻ Swap direction · Revolut → Coinbase