Diff

Mintlify vs Ford

68 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#08090a #333333
Brand
#0c8c5e #003478
Border
rgba(8, 9, 10, 0.07) #dde2e8
Display font
Inter FordF1
Body size
16px 16px
colors 59 changed
~ text #08090a #333333
~ text-strong #000000 #1a1a1a
~ text-faint rgba(8, 9, 10, 0.45) #9aa3ad
~ text-muted rgba(8, 9, 10, 0.3) #666666
~ brand #0c8c5e #003478
~ brand-deep #085f3f #00142e
~ link #0c8c5e #0860a8
~ link-hover #085f3f #003478
~ border rgba(8, 9, 10, 0.07) #dde2e8
~ border-strong rgba(8, 9, 10, 0.14) #b6bdc7
+ bg-soft #f5f7fa
+ bg-card #ffffff
+ bg-strong #e6ebf2
+ bg-dark #102b4e
+ bg-dark-elev #1a3a64
+ bg-deep #00142e
+ surface-soft #f5f7fa
+ surface-card #ffffff
+ surface-table #fafbfc
+ text-ink #102b4e
+ brand-hover #002757
+ brand-light #0860a8
+ brand-disabled #cdd5df
+ on-dark #ffffff
+ on-dark-soft #bcc6d2
+ accent-red #bf152c
+ accent-orange #f26822
+ border-soft #eceff3
+ border-on-dark rgba(255,255,255,0.18)
+ ring #003478
+ shadow-soft rgba(16,43,78,0.06)
+ shadow-elev rgba(16,43,78,0.12)
+ shadow-deep rgba(0,20,46,0.28)
+ success #258636
+ warning #f26822
+ danger #bf152c
+ info #0860a8
bg-secondary #f9f8f7
bg-tertiary #f4f2ef
surface-elev #fafaf9
text-medium #3a3b3c
text-soft rgba(8, 9, 10, 0.6)
brand-bright #10a370
brand-soft #e6f4ed
brand-tint #c5e6d5
cta-bg #08090a
cta-text #ffffff
selected-bg #f9f8f7
disabled rgba(8, 9, 10, 0.3)
border-subtle rgba(8, 9, 10, 0.04)
border-brand rgba(12, 140, 94, 0.30)
success-bg #e6f4ed
success-text #085f3f
warning-bg #fef4e6
warning-text #7a4a00
danger-bg #fdeeee
danger-text #a82020
info-bg #eef4fd
info-text #1a3a7a
typography 4 changed
~ display {"family":"Inter","size":64} {"family":"FordF1","size":72}
~ h1 {"family":"Inter","size":48} {"family":"FordF1","size":40}
~ h2 {"family":"Inter","size":40} {"family":"FordF1","size":32}
~ body {"family":"Inter","size":16} {"family":"FordF1","size":16}
radius identical
No differences.
spacing 5 changed
~ xs 1px 4px
~ sm 2px 8px
~ md 6px 16px
~ lg 16px 48px
~ xl 24px 96px
↻ Swap direction · Ford → Mintlify