Diff

Zed vs Bun

71 token-level differences between these two design systems.

Role tokens
Background
#f5f5f3 #fbf0df
Text
#393d45 #15151b
Brand
#004edb #f472b6
Border
#e2e2de #15151b1a
Display font
IBM Plex Serif CoFo Sans
Body size
16px 17px
colors 62 changed
~ bg #f5f5f3 #fbf0df
~ text #393d45 #15151b
~ text-strong #16181d #000000
~ brand #004edb #f472b6
~ brand-soft rgba(0,78,219,0.08) #fce7f3
~ on-brand #ffffff #15151b
~ link #004edb #db2777
~ link-hover #003fb5 #9d174d
~ border #e2e2de #15151b1a
~ border-strong #d4d4ce #15151b33
+ bg-soft #fff7e8
+ bg-strong #f5e8d0
+ surface #ffffff
+ surface-strong #fdfaf2
+ text-muted #6b6b6b
+ text-faint #9a9a9a
+ brand-strong #db2777
+ brand-faint #fdf2f8
+ accent #fbbf24
+ accent-strong #f59e0b
+ accent-soft #fef3c7
+ selected #fce7f3
+ disabled-bg #f5e8d0
+ disabled-text #9a9a9a
+ border-subtle #15151b0d
+ divider #15151b14
+ inverse-bg #15151b
+ inverse-text #fbf0df
+ inverse-text-muted #a1a1aa
+ shadow-warm rgba(21, 21, 27, 0.08)
+ shadow-pink rgba(244, 114, 182, 0.18)
+ success-bg #dcfce7
+ success-text #166534
+ success-border #86efac
+ warning-bg #fef3c7
+ warning-text #854d0e
+ warning-border #fbbf24
+ danger-bg #fee2e2
+ danger-text #991b1b
+ danger-border #fca5a5
+ info-bg #fce7f3
+ info-text #9d174d
+ info-border #f9a8d4
+ on-accent #15151b
bg-100 #ffffff
bg-200 #eeede9
bg-300 #e7e6e1
surface-card #ffffff
surface-code #1a1b1e
text-200 #5a5e66
text-300 #6b6f78
text-400 #86888f
brand-hover #003fb5
cta-secondary-bg #ffffff
cta-secondary-text #16181d
border-focus #004edb
code-bg #1a1b1e
code-text #e6e6e3
semantic-success #2e7d32
semantic-warning #b54708
semantic-danger #c01919
semantic-info #004edb
typography 5 changed
~ display {"family":"IBM Plex Serif","size":72} {"family":"CoFo Sans","size":96}
~ h1 {"family":"IBM Plex Serif","size":48} {"family":"CoFo Sans","size":52}
~ h2 {"family":"IBM Plex Serif","size":36} {"family":"CoFo Sans","size":40}
~ body {"family":"writer","size":16} {"family":"Inter","size":17}
~ label {"family":"writer-mono","size":13} {"family":"Berkeley Mono","size":11}
radius 1 changed
~ card 8px 12px
spacing 3 changed
~ xs 0px 2px
~ lg 32px 24px
~ xl 64px 40px
↻ Swap direction · Bun → Zed