Diff

Mailchimp vs MetaMask

62 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#241c15 #1a1a1a
Brand
#ffe01b #f6851b
Border
#241c15 #d6d9dc
Display font
Cooper Light MM Sans
Body size
17px 16px
colors 55 changed
~ surface #f6f6f4 #ffffff
~ surface-soft #fbfbf8 #fafafa
~ text #241c15 #1a1a1a
~ text-strong #0d0a05 #000000
~ text-muted #6e655a #535a61
~ text-soft #9b9388 #8e8e8e
~ text-faint #bfb8ac #bcbcbc
~ text-on-brand #241c15 #ffffff
~ brand #ffe01b #f6851b
~ brand-deep #ffd60a #a85400
~ brand-pressed #e6c800 #cc6800
~ border #241c15 #d6d9dc
~ border-soft #e0ddd4 #eaecef
~ success #1c8c4a #1a8757
~ warning #d97706 #cc8800
~ danger #c1272d #d73a49
~ info #2563eb #037dd6
~ on-brand #241c15 #ffffff
+ bg-soft #f5f5f5
+ bg-warm #fdf6ed
+ surface-strong #f0f0f0
+ brand-hover #e3760e
+ brand-tint #fde5cc
+ brand-soft #fbcc99
+ fox-blue #037dd6
+ fox-blue-deep #0260a4
+ fox-red #d73a49
+ link #037dd6
+ link-hover #0260a4
+ selected-bg #fde5cc
+ border-strong #bbbfc4
+ border-brand #f6851b
+ network-eth #627eea
+ network-polygon #8247e5
+ network-arbitrum #28a0f0
+ network-optimism #ff0420
bg-yellow #ffe01b
bg-cream #fbf8f0
bg-dark #241c15
surface-2 #eeede9
surface-3 #e3e1db
surface-yellow-soft #fff5b8
surface-yellow-deep #ffd60a
text-on-yellow #241c15
text-on-dark #fbf8f0
text-on-dark-muted #bfb8ac
accent #241c15
accent-cream #f5f2eb
accent-cream-deep #e8e1d0
border-stronger #0d0a05
border-yellow-on-yellow #241c1533
success-bg #d6efe2
warning-bg #fef3c7
danger-bg #fde2e2
info-bg #dbeafe
typography 5 changed
~ display {"family":"Cooper Light","size":120} {"family":"MM Sans","size":72}
~ h1 {"family":"Cooper Light","size":60} {"family":"MM Sans","size":36}
~ h2 {"family":"Cooper Light","size":44} {"family":"MM Sans","size":28}
~ body {"family":"Graphik","size":17} {"family":"MM Sans","size":16}
~ label {"family":"JetBrains Mono","size":14} {"family":"JetBrains Mono","size":13}
radius 2 changed
~ button 0px 12px
~ card 0px 16px
spacing identical
No differences.
↻ Swap direction · MetaMask → Mailchimp