Diff

Mintlify vs Render

69 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#08090a #373145
Brand
#0c8c5e #8a05ff
Border
rgba(8, 9, 10, 0.07) #0000001a
Display font
Inter Inter
Body size
16px 16px
colors 60 changed
~ surface #ffffff #fafafa
~ text #08090a #373145
~ text-soft rgba(8, 9, 10, 0.6) #9089a0
~ text-faint rgba(8, 9, 10, 0.45) #bcb6c8
~ text-muted rgba(8, 9, 10, 0.3) #5e5b6f
~ brand #0c8c5e #8a05ff
~ brand-deep #085f3f #3d0270
~ link #0c8c5e #8a05ff
~ link-hover #085f3f #6e04cc
~ disabled rgba(8, 9, 10, 0.3) #e6e4ec
~ border rgba(8, 9, 10, 0.07) #0000001a
~ border-strong rgba(8, 9, 10, 0.14) #00000033
~ border-brand rgba(12, 140, 94, 0.30) #8a05ff66
~ success-bg #e6f4ed #dffaef
~ warning-bg #fef4e6 #fff4e0
~ danger-bg #fdeeee #ffe5e8
~ info-bg #eef4fd #e6daff
+ bg-deep #fafafa
+ bg-elev-1 #f5f3fb
+ bg-elev-2 #ffffff
+ surface-soft #e6daff
+ surface-glow #fbceff
+ surface-deep #f3eefe
+ brand-hover #6e04cc
+ brand-pressed #5a039f
+ brand-glow #8a05ff1f
+ accent #9d66ff
+ accent-hover #b08aff
+ accent-soft #e6daff
+ accent-glow #fbceff
+ link-visited #6a04b8
+ selected #8a05ff14
+ disabled-text #a8a4b4
+ text-heading #1f1a2e
+ text-disabled #a8a4b4
+ border-soft #0000000d
+ shadow-ambient rgba(55,49,69,0.06)
+ shadow-standard rgba(55,49,69,0.1)
+ shadow-elevated rgba(138,5,255,0.18)
+ shadow-glow rgba(251,206,255,0.5)
+ success #0a8754
+ warning #cc7400
+ danger #d72638
+ info #8a05ff
bg-secondary #f9f8f7
bg-tertiary #f4f2ef
surface-elev #fafaf9
text-strong #000000
text-medium #3a3b3c
brand-bright #10a370
brand-soft #e6f4ed
brand-tint #c5e6d5
cta-bg #08090a
cta-text #ffffff
selected-bg #f9f8f7
border-subtle rgba(8, 9, 10, 0.04)
success-text #085f3f
warning-text #7a4a00
danger-text #a82020
info-text #1a3a7a
typography 3 changed
~ display {"family":"Inter","size":64} {"family":"Inter","size":88}
~ h2 {"family":"Inter","size":40} {"family":"Inter","size":36}
~ label {"family":"JetBrains Mono","size":11} {"family":"JetBrains Mono","size":12}
radius 1 changed
~ card 12px 24px
spacing 5 changed
~ xs 1px 2px
~ sm 2px 4px
~ md 6px 12px
~ lg 16px 24px
~ xl 24px 40px
↻ Swap direction · Render → Mintlify