Diff

Windsurf vs Captions

64 token-level differences between these two design systems.

Role tokens
Background
#f6eede #ffffff
Text
#0b100f #1d1f20
Brand
#34e8bb #6c4df7
Border
#c0c1c6 #dfe5e7
Display font
tomatoGrotesk Exposure
Body size
16px 16px
colors 60 changed
~ bg #f6eede #ffffff
~ surface #ffffff #eef4f6
~ text #0b100f #1d1f20
~ text-muted #5a615d #595e5e
~ text-faint #8a8f8b #9fa5a7
~ brand #34e8bb #6c4df7
~ on-brand #003326 #ffffff
~ link #0b100f #6c4df7
~ link-hover #0fbf97 #160f31
~ border #c0c1c6 #dfe5e7
+ bg-cool #f5f9fa
+ surface-100 #e8eff2
+ surface-150 #dfe5e7
+ text-h1 #2a2c2d
+ text-strong #141515
+ text-soft #7e8486
+ text-disabled #bec3c6
+ brand-purple #ab88fb
+ brand-dark #160f31
+ accent-sea #00d0ff
+ accent-sky #a6ecff
+ accent-air #effbff
+ accent-sunset #f99f3f
+ accent-peach #ffca9f
+ accent-cloud #ffcfcf
+ accent-barbie-pink #ff1476
+ accent-pink #ff9bb2
+ accent-meadow #5bf6bb
+ accent-green #46e7b4
+ accent-lime #aaff4e
+ accent-yellow #fcff41
+ accent-mustard #ffdd33
+ cta-chrome-bg #eef4f6
+ cta-tile-bg #f5f9fa
+ border-strong #d0d6d7
+ border-subtle #e8eff2
+ border-brand rgba(108, 77, 247, 0.32)
+ success-bg #ebfdf2
+ success-text #0e663b
+ info-bg #eff7ff
+ info-text #00b7e4
+ warning-bg #fffcef
+ warning-text #e07300
+ danger-bg #fff0f0
+ danger-text #d00000
bg-soft #fbf7ee
surface-dark #0b100f
surface-dark-soft #141a18
text-on-dark #ffffff
text-body #3a423f
text-on-dark-muted rgba(255, 255, 255, 0.7)
brand-deep #0fbf97
border-soft #e3e0d6
border-dark rgba(255, 255, 255, 0.12)
ring rgba(67, 128, 180, 0.5)
success #0fbf97
warning #c08a2e
danger #d8413f
info #4380b4
shadow-tint rgba(11, 16, 15, 0.10)
typography 4 changed
~ display {"family":"tomatoGrotesk","size":72} {"family":"Exposure","size":80}
~ h1 {"family":"tomatoGrotesk","size":48} {"family":"Exposure","size":48}
~ h2 {"family":"tomatoGrotesk","size":40} {"family":"Exposure","size":32}
~ body {"family":"Inter","size":16} {"family":"DenimINK","size":16}
radius identical
No differences.
spacing identical
No differences.
↻ Swap direction · Captions → Windsurf