Diff

Everlane vs Vapi

48 token-level differences between these two design systems.

Role tokens
Background
#ffffff #0e0e13
Text
#000000 #fffaea
Brand
#121212 #7ccf00
Border
#000000 rgba(255, 255, 255, 0.08)
Display font
Maison Neue Book avantt
Body size
16px 16px
colors 41 changed
~ bg #ffffff #0e0e13
~ surface #f7f7f5 #16161c
~ surface-soft #fafaf9 #1f1f23
~ text #000000 #fffaea
~ text-muted #767676 #b7b3a9
~ text-soft #9b9b9b #86847e
~ brand #121212 #7ccf00
~ on-brand #ffffff #0e0e13
~ link #000000 #7ccf00
~ border #000000 rgba(255, 255, 255, 0.08)
~ border-soft #e4e4e2 rgba(255, 255, 255, 0.04)
~ success #1f7a3d #7ccf00
~ warning #9a6b00 #fdc700
~ danger #b3261e #fb2c36
+ bg-soft #16161c
+ bg-band #1f1f23
+ surface-hover #28282f
+ text-strong #ffffff
+ text-faint #56544f
+ brand-hover #8ee10f
+ brand-active #6bb500
+ brand-soft rgba(124, 207, 0, 0.16)
+ brand-faint rgba(124, 207, 0, 0.08)
+ accent-red #fb2c36
+ accent-amber #fdc700
+ accent-orange #ff6900
+ accent #7ccf00
+ border-strong rgba(255, 255, 255, 0.16)
+ cta-dark-bg #000000
+ cta-dark-text #fafafa
+ cta-light-bg #ffffff
+ cta-light-text #000000
+ success-bg rgba(124, 207, 0, 0.16)
+ warning-bg rgba(253, 199, 0, 0.16)
+ danger-bg rgba(251, 44, 54, 0.16)
+ info #fffaea
+ info-bg #1f1f23
text-display #121212
border-input #bdbdbd
scrim rgba(0,0,0,0.45)
sale #b3261e
typography 4 changed
~ display {"family":"Maison Neue Book","size":56} {"family":"avantt","size":96}
~ h1 {"family":"Maison Neue Book","size":32} {"family":"avantt","size":80}
~ h2 {"family":"Maison Neue Book","size":26} {"family":"avantt","size":58}
~ body {"family":"Maison Neue Book","size":16} {"family":"seasonSans","size":16}
radius 3 changed
~ button 0px 8px
~ card 0px 12px
~ pill 0px 9999px
spacing identical
No differences.
↻ Swap direction · Vapi → Everlane