Diff

Replicate vs Mintlify

44 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#202020 #08090a
Brand
#202020 #0c8c5e
Border
#e9e9e9 rgba(8, 9, 10, 0.07)
Display font
rb-freigeist-neue Inter
Body size
16px 16px
colors 35 changed
~ surface #fcfcfc #ffffff
~ text #202020 #08090a
~ text-medium #404040 #3a3b3c
~ text-soft #646464 rgba(8, 9, 10, 0.6)
~ text-muted #8a8a8a rgba(8, 9, 10, 0.3)
~ text-faint #b3b3b3 rgba(8, 9, 10, 0.45)
~ brand #202020 #0c8c5e
~ brand-deep #000000 #085f3f
~ on-brand #fcfcfc #ffffff
~ link #202020 #0c8c5e
~ link-hover #000000 #085f3f
~ selected-bg #f5f5f5 #f9f8f7
~ disabled #b3b3b3 rgba(8, 9, 10, 0.3)
~ border #e9e9e9 rgba(8, 9, 10, 0.07)
~ border-strong #cccccc rgba(8, 9, 10, 0.14)
~ border-subtle #f0f0f0 rgba(8, 9, 10, 0.04)
~ success-bg #e7f5ec #e6f4ed
~ success-text #1f6b3e #085f3f
~ warning-bg #fef6e4 #fef4e6
~ warning-text #7a5a14 #7a4a00
~ danger-bg #fbebec #fdeeee
~ danger-text #9a2c34 #a82020
~ info-bg #eef2f7 #eef4fd
~ info-text #1f4a7a #1a3a7a
+ bg-secondary #f9f8f7
+ bg-tertiary #f4f2ef
+ surface-elev #fafaf9
+ brand-bright #10a370
+ brand-soft #e6f4ed
+ brand-tint #c5e6d5
+ cta-bg #08090a
+ cta-text #ffffff
+ border-brand rgba(12, 140, 94, 0.30)
bg-alt #fdfdfd
surface-light #f5f5f5
typography 5 changed
~ display {"family":"rb-freigeist-neue","size":96} {"family":"Inter","size":64}
~ h1 {"family":"rb-freigeist-neue","size":56} {"family":"Inter","size":48}
~ h2 {"family":"rb-freigeist-neue","size":48} {"family":"Inter","size":40}
~ body {"family":"basier-square","size":16} {"family":"Inter","size":16}
~ label {"family":"jetbrains-mono","size":11} {"family":"JetBrains Mono","size":11}
radius 2 changed
~ button 0px 8px
~ card 0px 12px
spacing 2 changed
~ lg 12px 16px
~ xl 20px 24px
↻ Swap direction · Mintlify → Replicate