Diff

Nuxt vs Mintlify

53 token-level differences between these two design systems.

Role tokens
Background
#020420 #ffffff
Text
#ffffff #08090a
Brand
#00dc82 #0c8c5e
Border
rgba(255, 255, 255, 0.08) rgba(8, 9, 10, 0.07)
Display font
DM Sans Inter
Body size
16px 16px
colors 43 changed
~ bg #020420 #ffffff
~ surface #10142e #ffffff
~ text #ffffff #08090a
~ text-strong #ffffff #000000
~ text-medium #dbdfe9 #3a3b3c
~ text-muted #a0a8b8 rgba(8, 9, 10, 0.3)
~ text-soft #7c8497 rgba(8, 9, 10, 0.6)
~ text-faint #525a6c rgba(8, 9, 10, 0.45)
~ brand #00dc82 #0c8c5e
~ brand-deep #008a4f #085f3f
~ brand-soft #003b22 #e6f4ed
~ brand-bright #80eeb4 #10a370
~ on-brand #020420 #ffffff
~ link #00dc82 #0c8c5e
~ link-hover #80eeb4 #085f3f
~ selected-bg rgba(0, 220, 130, 0.10) #f9f8f7
~ disabled #525a6c rgba(8, 9, 10, 0.3)
~ border rgba(255, 255, 255, 0.08) rgba(8, 9, 10, 0.07)
~ border-strong rgba(255, 255, 255, 0.15) rgba(8, 9, 10, 0.14)
~ border-brand rgba(0, 220, 130, 0.40) rgba(12, 140, 94, 0.30)
~ success-bg rgba(0, 220, 130, 0.12) #e6f4ed
~ success-text #80eeb4 #085f3f
~ warning-bg rgba(251, 191, 36, 0.12) #fef4e6
~ warning-text #fcd34d #7a4a00
~ danger-bg rgba(239, 68, 68, 0.12) #fdeeee
~ danger-text #fca5a5 #a82020
~ info-bg rgba(96, 165, 250, 0.12) #eef4fd
~ info-text #93c5fd #1a3a7a
+ bg-secondary #f9f8f7
+ bg-tertiary #f4f2ef
+ surface-elev #fafaf9
+ brand-tint #c5e6d5
+ cta-bg #08090a
+ cta-text #ffffff
+ border-subtle rgba(8, 9, 10, 0.04)
bg-soft #0a0d2a
bg-deep #050729
surface-strong #1a1f42
brand-hover #00b86a
glow rgba(0, 220, 130, 0.40)
glow-soft rgba(0, 220, 130, 0.18)
border-soft rgba(255, 255, 255, 0.04)
warning #fbbf24
typography 4 changed
~ display {"family":"DM Sans","size":88} {"family":"Inter","size":64}
~ h1 {"family":"DM Sans","size":56} {"family":"Inter","size":48}
~ h2 {"family":"DM Sans","size":44} {"family":"Inter","size":40}
~ label {"family":"DM Mono","size":12} {"family":"JetBrains Mono","size":11}
radius 1 changed
~ card 16px 12px
spacing 5 changed
~ xs 2px 1px
~ sm 4px 2px
~ md 12px 6px
~ lg 24px 16px
~ xl 40px 24px
↻ Swap direction · Mintlify → Nuxt