Diff

Everlane vs Oura

57 token-level differences between these two design systems.

Role tokens
Background
#ffffff #000000
Text
#000000 #ffffff
Brand
#121212 #d6c283
Border
#000000 #262626
Display font
Maison Neue Book Inter
Body size
16px 16px
colors 45 changed
~ bg #ffffff #000000
~ surface #f7f7f5 #0d0d0d
~ surface-soft #fafaf9 #1a1a1a
~ text #000000 #ffffff
~ text-muted #767676 #b5b5b5
~ text-soft #9b9b9b #8a8a8a
~ brand #121212 #d6c283
~ link #000000 #ffffff
~ border #000000 #262626
~ border-soft #e4e4e2 #1a1a1a
~ border-input #bdbdbd #4d4d4d
~ scrim rgba(0,0,0,0.45) rgba(0,0,0,0.8)
~ success #1f7a3d #84d97e
~ warning #9a6b00 #d9b67e
~ danger #b3261e #d97e84
+ bg-elev #0d0d0d
+ bg-elev-strong #1a1a1a
+ bg-light #ffffff
+ bg-cream #f5f0e6
+ surface-strong #262626
+ brand-hover #c4ae6a
+ brand-active #a8924f
+ brand-pale #ede4cb
+ brand-deep #7d6a3d
+ brand-soft #1a1612
+ ring-titanium #8a8a8a
+ ring-rose-gold #c4847a
+ ring-stealth #3a3a3a
+ text-strong #ffffff
+ text-faint #666666
+ text-on-brand #000000
+ text-on-light #000000
+ link-hover #d6c283
+ border-strong #3a3a3a
+ score-readiness #84d97e
+ score-sleep #7eb8d9
+ score-activity #d9b67e
+ score-stress #d97e84
+ score-resilience #9c7ed9
+ shadow-card rgba(0,0,0,0.5)
+ shadow-elev rgba(0,0,0,0.7)
+ info #7eb8d9
text-display #121212
on-brand #ffffff
sale #b3261e
typography 5 changed
~ display {"family":"Maison Neue Book","size":56} {"family":"Inter","size":72}
~ h1 {"family":"Maison Neue Book","size":32} {"family":"Inter","size":40}
~ h2 {"family":"Maison Neue Book","size":26} {"family":"Inter","size":32}
~ body {"family":"Maison Neue Book","size":16} {"family":"Inter","size":16}
~ label {"family":"SFMono-Regular","size":13} {"family":"Inter","size":11}
radius 3 changed
~ button 0px 8px
~ card 0px 12px
~ pill 0px 9999px
spacing 4 changed
~ xs 0px 4px
~ sm 4px 8px
~ md 12px 16px
~ xl 64px 48px
↻ Swap direction · Oura → Everlane