Diff

Zed vs Our Place

47 token-level differences between these two design systems.

Role tokens
Background
#f5f5f3 #fcfaf6
Text
#393d45 #35312e
Brand
#004edb #af5a3c
Border
#e2e2de #e4dccb
Display font
IBM Plex Serif Chelt
Body size
16px 16px
colors 40 changed
~ bg #f5f5f3 #fcfaf6
~ text #393d45 #35312e
~ text-strong #16181d #2a2724
~ brand #004edb #af5a3c
~ brand-soft rgba(0,78,219,0.08) #d8a087
~ cta-secondary-bg #ffffff #ebe5d4
~ cta-secondary-text #16181d #35312e
~ link #004edb #af5a3c
~ link-hover #003fb5 #8f4730
~ border #e2e2de #e4dccb
~ border-strong #d4d4ce #35312e
+ bg-soft #f6f1e8
+ bg-deeper #efe7d8
+ surface #ffffff
+ surface-soft #f6f1e8
+ brand-deep #8f4730
+ text-muted #6b645c
+ text-faint #9a9189
+ text-on-image #ffffff
+ border-soft #efe7d8
+ success #5a7a4d
+ warning #c8861a
+ danger #a73b2b
+ info #5c707e
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
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":"Chelt","size":80}
~ h1 {"family":"IBM Plex Serif","size":48} {"family":"Chelt","size":60}
~ h2 {"family":"IBM Plex Serif","size":36} {"family":"Chelt","size":40}
~ body {"family":"writer","size":16} {"family":"Plaid-XS-Web","size":16}
~ label {"family":"writer-mono","size":13} {"family":"SFMono-Regular","size":13}
radius 2 changed
~ button 6px 8px
~ card 8px 12px
spacing identical
No differences.
↻ Swap direction · Our Place → Zed