Diff

MiniMax vs Miro

70 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#0a0a0a #1c1c1e
Brand
#0a0a0a #1c1c1e
Border
#e5e7eb #e0e2e8
Display font
DM Sans Roobert PRO
Body size
16px 16px
colors 62 changed
~ surface #ffffff #f7f8fa
~ text #0a0a0a #1c1c1e
~ text-muted #8e8e93 #a5a8b5
~ brand #0a0a0a #1c1c1e
~ brand-pressed #222222 #2c2c34
~ brand-coral #ff5530 #ff9999
~ brand-blue #1456f0 #4262ff
~ border #e5e7eb #e0e2e8
~ border-soft #eaecf0 #eef0f3
~ semantic-error #d45656 #c41c1c
+ bg-soft #fafbfc
+ bg-yellow #fff8e0
+ bg-pricing-featured #f5f3ff
+ text-deep #050038
+ text-charcoal #2c2c34
+ text-slate #555a6a
+ text-steel #6b6f7e
+ text-stone #8e91a0
+ on-dark-muted #a5a8b5
+ brand-yellow #ffd02f
+ brand-yellow-deep #fcb900
+ yellow-light #fff4c4
+ yellow-dark #746019
+ blue-450 #5b76fe
+ blue-pressed #2a41b6
+ coral-light #ffc6c6
+ coral-dark #600000
+ brand-rose #ffd8f4
+ brand-pink #fde0f0
+ rose-light #fde0f0
+ brand-teal #0fbcb0
+ teal-light #c3faf5
+ moss-dark #187574
+ brand-orange-light #ffe6cd
+ brand-red #fbd4d4
+ success-accent #00b473
+ border-strong #c7cad5
+ footer-bg #1c1c1e
+ link #4262ff
+ link-hover #2a41b6
+ semantic-success #00b473
+ semantic-warning #fcb900
+ semantic-info #4262ff
bg-surface-soft #f2f3f5
bg-footer #0a0a0a
surface-card #ffffff
surface-feature #f7f8fa
text-strong #000000
text-body #222222
text-secondary #45515e
text-tertiary #5f5f5f
text-faint #a8aab2
brand-magenta #ea5ec1
brand-blue-deep #1d4ed8
brand-blue-mid #3b82f6
brand-blue-700 #17437d
brand-blue-200 #bfdbfe
brand-cyan #3daeff
brand-purple #a855f7
on-coral #ffffff
semantic-success-bg #e8ffea
semantic-success-text #1ba673
typography 4 changed
~ display {"family":"DM Sans","size":72} {"family":"Roobert PRO","size":72}
~ h1 {"family":"DM Sans","size":40} {"family":"Roobert PRO","size":40}
~ h2 {"family":"DM Sans","size":32} {"family":"Roobert PRO","size":32}
~ body {"family":"DM Sans","size":16} {"family":"Roobert PRO","size":16}
radius identical
No differences.
spacing 4 changed
~ xs 8px 4px
~ sm 12px 8px
~ lg 20px 32px
~ xl 24px 48px
↻ Swap direction · Miro → MiniMax