Diff

ElevenLabs vs Bose

69 token-level differences between these two design systems.

Role tokens
Background
#ffffff #000000
Text
#0a0a0a #ffffff
Brand
#9fe870 #000000
Border
#0000001a #262626
Display font
InterDisplay Inter
Body size
16px 16px
colors 58 changed
~ bg #ffffff #000000
~ bg-soft #fafafa #1a1a1a
~ surface #ffffff #0d0d0d
~ surface-hover #f5f5f4 #1f1f1f
~ text #0a0a0a #ffffff
~ text-strong #000000 #ffffff
~ text-muted #525252 #d6d6d6
~ text-soft #737373 #a3a3a3
~ brand #9fe870 #000000
~ brand-hover #8ad65e #262626
~ link #0a0a0a #ffffff
~ border #0000001a #262626
~ border-soft #0000000d #1a1a1a
~ border-strong #00000033 #404040
~ on-brand #0a0a0a #ffffff
~ success #16a34a #10b981
~ warning #d97706 #f59e0b
~ info #0a0a0a #ffffff
+ bg-light #ffffff
+ bg-elev #0d0d0d
+ bg-warm-light #f5f5f5
+ surface-light #fafafa
+ text-inverse #000000
+ text-inverse-muted #5c5c5c
+ text-inverse-soft #737373
+ brand-on-dark #ffffff
+ brand-cta-dark #ffffff
+ brand-cta-light #000000
+ border-on-light #e5e5e5
+ border-on-light-strong #cccccc
+ ring #ffffff
+ ring-on-light #000000
+ link-hover #d6d6d6
+ link-on-light #000000
+ badge-bg #ffffff
+ badge-text #000000
+ rating-star #ffd700
+ product-shadow rgba(0,0,0,0.5)
+ product-shadow-light rgba(0,0,0,0.1)
+ modal-overlay rgba(0,0,0,0.7)
+ audio-cyan #3dd5e8
+ qc-line #999999
+ cta-strikethrough #a3a3a3
+ sale-price #e60023
bg-band #f5f5f4
surface-soft #fafafa
text-display #0a0a0a
text-faint #a3a3a3
text-on-brand #0a0a0a
brand-active #76c349
brand-soft #d4f0c2
brand-faint #e2f6d5
accent #0e0f0c
accent-warm #f5f5f4
success-bg #dcfce7
warning-bg #fef3c7
danger-bg #fee2e2
info-bg #f5f5f4
typography 4 changed
~ display {"family":"InterDisplay","size":128} {"family":"Inter","size":72}
~ h1 {"family":"InterDisplay","size":64} {"family":"Inter","size":40}
~ h2 {"family":"InterDisplay","size":48} {"family":"Inter","size":32}
~ label {"family":"JetBrains Mono","size":13} {"family":"JetBrains Mono","size":11}
radius 2 changed
~ button 8px 6px
~ card 16px 8px
spacing 5 changed
~ xs 1px 4px
~ sm 2px 8px
~ md 6px 16px
~ lg 16px 40px
~ xl 24px 64px
↻ Swap direction · Bose → ElevenLabs