Diff

Discord vs MiniMax

74 token-level differences between these two design systems.

Role tokens
Background
#5865f2 #ffffff
Text
#ffffff #0a0a0a
Brand
#5865f2 #0a0a0a
Border
rgba(255,255,255,0.10) #e5e7eb
Display font
ABC Ginto Nord Discord DM Sans
Body size
16px 16px
colors 63 changed
~ bg #5865f2 #ffffff
~ surface-card #fafafa #ffffff
~ text #ffffff #0a0a0a
~ text-strong #ffffff #000000
~ text-faint rgba(255,255,255,0.40) #a8aab2
~ brand #5865f2 #0a0a0a
~ border rgba(255,255,255,0.10) #e5e7eb
~ border-soft rgba(255,255,255,0.06) #eaecf0
+ bg-surface #f7f8fa
+ bg-surface-soft #f2f3f5
+ bg-footer #0a0a0a
+ surface-feature #f7f8fa
+ text-body #222222
+ text-secondary #45515e
+ text-tertiary #5f5f5f
+ text-muted #8e8e93
+ brand-pressed #222222
+ brand-coral #ff5530
+ brand-magenta #ea5ec1
+ brand-blue #1456f0
+ brand-blue-deep #1d4ed8
+ brand-blue-mid #3b82f6
+ brand-blue-700 #17437d
+ brand-blue-200 #bfdbfe
+ brand-cyan #3daeff
+ brand-purple #a855f7
+ on-dark #ffffff
+ on-coral #ffffff
+ semantic-success-bg #e8ffea
+ semantic-success-text #1ba673
+ semantic-error #d45656
bg-deep #1a2081
bg-pink #ed7395
bg-aubergine #1a1b3a
surface-soft #f6f6f6
surface-elev #23272a
text-on-light #23272a
text-on-light-muted #4f5660
text-soft rgba(255,255,255,0.72)
text-disabled rgba(255,255,255,0.24)
brand-100 #e7e9fd
brand-200 #c8ccfa
brand-300 #a4abf7
brand-400 #7983f5
brand-500 #5865f2
brand-600 #404eed
brand-700 #3641cc
brand-800 #28339e
brand-900 #1a2081
focus #00b0f4
link #00b0f4
link-hover #33c2f7
green-bright #23a55a
yellow-bright #f0b232
red-bright #f23f43
border-light rgba(0,0,0,0.08)
border-strong rgba(255,255,255,0.18)
shadow-card rgba(0,0,0,0.15)
shadow-modal rgba(0,0,0,0.40)
semantic-success #23a55a
semantic-warning #f0b232
semantic-danger #f23f43
semantic-info #00b0f4
typography 4 changed
~ display {"family":"ABC Ginto Nord Discord","size":88} {"family":"DM Sans","size":72}
~ h1 {"family":"ABC Ginto Nord Discord","size":44} {"family":"DM Sans","size":40}
~ h2 {"family":"ABC Ginto Nord Discord","size":32} {"family":"DM Sans","size":32}
~ body {"family":"gg sans","size":16} {"family":"DM Sans","size":16}
radius 2 changed
~ button 12px 8px
~ card 16px 12px
spacing 5 changed
~ xs 2px 8px
~ sm 4px 12px
~ md 12px 16px
~ lg 24px 20px
~ xl 40px 24px
↻ Swap direction · MiniMax → Discord