Diff

Zed vs Biome

68 token-level differences between these two design systems.

Role tokens
Background
#f5f5f3 #ffffff
Text
#393d45 #353841
Brand
#004edb #0065da
Border
#e2e2de #e4e7ec
Display font
IBM Plex Serif Inter
Body size
16px 16px
colors 61 changed
~ bg #f5f5f3 #ffffff
~ text #393d45 #353841
~ text-strong #16181d #17181c
~ brand #004edb #0065da
~ brand-soft rgba(0,78,219,0.08) #e6f0fc
~ link #004edb #0065da
~ link-hover #003fb5 #0052b3
~ border #e2e2de #e4e7ec
~ border-strong #d4d4ce #d0d5dd
+ bg-soft #f7f8fa
+ bg-strong #eef0f3
+ surface #ffffff
+ surface-soft #fbfcfd
+ text-muted #6b7280
+ text-faint #9ca3af
+ brand-strong #0052b3
+ brand-faint #f2f7fe
+ accent #0065da
+ accent-soft #e6f0fc
+ selected #e6f0fc
+ disabled-bg #eef0f3
+ disabled-text #9ca3af
+ border-subtle #f0f1f4
+ divider #e4e7ec
+ inverse-bg #17181c
+ inverse-text #e4e7ec
+ inverse-text-muted #9ca3af
+ shadow-ambient rgba(16, 24, 40, 0.04)
+ shadow-standard rgba(16, 24, 40, 0.08)
+ shadow-brand rgba(0, 101, 218, 0.18)
+ success-bg #ecfdf3
+ success-text #027a48
+ success-border #abefc6
+ warning-bg #fffaeb
+ warning-text #b54708
+ warning-border #fedf89
+ danger-bg #fef3f2
+ danger-text #b42318
+ danger-border #fecdca
+ info-bg #e6f0fc
+ info-text #0052b3
+ info-border #b3d4f5
+ on-inverse #e4e7ec
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":"Inter","size":80}
~ h1 {"family":"IBM Plex Serif","size":48} {"family":"Inter","size":64}
~ h2 {"family":"IBM Plex Serif","size":36} {"family":"Inter","size":40}
~ body {"family":"writer","size":16} {"family":"Inter","size":16}
~ label {"family":"writer-mono","size":13} {"family":"JetBrains Mono","size":13}
radius 2 changed
~ button 6px 5px
~ card 8px 12px
spacing identical
No differences.
↻ Swap direction · Biome → Zed