Diff

Everlane vs Readwise

57 token-level differences between these two design systems.

Role tokens
Background
#ffffff #fdf7ef
Text
#000000 #2c2418
Brand
#121212 #ff7a45
Border
#000000 #e5d9c4
Display font
Maison Neue Book Tiempos Headline
Body size
16px 17px
colors 45 changed
~ bg #ffffff #fdf7ef
~ surface #f7f7f5 #f5ecdf
~ surface-soft #fafaf9 #fbf3e7
~ text #000000 #2c2418
~ text-muted #767676 #6b5e4a
~ text-soft #9b9b9b #9b8d75
~ brand #121212 #ff7a45
~ link #000000 #ff7a45
~ border #000000 #e5d9c4
~ border-soft #e4e4e2 #f0e7d5
~ scrim rgba(0,0,0,0.45) rgba(44,36,24,0.45)
~ success #1f7a3d #3d6b4a
~ warning #9a6b00 #c97a1f
~ danger #b3261e #b94326
+ bg-alt #ffffff
+ bg-deep #f9f0e0
+ surface-warm #f5ecdf
+ surface-deep #e8d9c2
+ surface-paper #ffffff
+ text-strong #1a1308
+ text-faint #b6a888
+ text-on-brand #ffffff
+ text-on-dark #fdf7ef
+ brand-hover #e8602a
+ brand-active #cc4a1a
+ brand-deep #a83a14
+ brand-soft #ffe4d4
+ brand-paler #fff0e6
+ accent #3d6b4a
+ accent-soft #dfeae0
+ accent-deep #27432f
+ highlight-bg #fff4d6
+ highlight-text #2c2418
+ underline #ff7a45
+ link-hover #cc4a1a
+ link-visited #7d3c84
+ border-strong #d4c4a8
+ shadow-warm rgba(60,40,15,0.05)
+ shadow-card rgba(60,40,15,0.10)
+ shadow-elev rgba(60,40,15,0.18)
+ warning-soft #fdf0d8
+ info #4d6580
text-display #121212
border-input #bdbdbd
sale #b3261e
typography 5 changed
~ display {"family":"Maison Neue Book","size":56} {"family":"Tiempos Headline","size":68}
~ h1 {"family":"Maison Neue Book","size":32} {"family":"Tiempos Headline","size":60}
~ h2 {"family":"Maison Neue Book","size":26} {"family":"Tiempos Headline","size":40}
~ body {"family":"Maison Neue Book","size":16} {"family":"Inter","size":17}
~ label {"family":"SFMono-Regular","size":13} {"family":"JetBrains Mono","size":12}
radius 3 changed
~ button 0px 10px
~ card 0px 16px
~ pill 0px 9999px
spacing 4 changed
~ xs 0px 4px
~ sm 4px 8px
~ md 12px 16px
~ xl 64px 48px
↻ Swap direction · Readwise → Everlane