Diff

The Washington Post vs Marriott

61 token-level differences between these two design systems.

Role tokens
Background
#ffffff #f9f6f0
Text
#000000 #2a2a2a
Brand
#000000 #a4793f
Border
#cccccc #e0d9c8
Display font
Postoni Caudex
Body size
18px 16px
colors 54 changed
~ bg #ffffff #f9f6f0
~ surface-soft #f8f8f8 #fdfcf8
~ surface-strong #eeeeee #f5efe5
~ text #000000 #2a2a2a
~ text-strong #000000 #1f2a44
~ text-muted #444444 #6a6a6a
~ text-soft #666666 #8c8c8c
~ text-faint #999999 #b8b8b8
~ brand #000000 #a4793f
~ link #2a64a6 #a4793f
~ link-hover #173e6e #1f2a44
~ border #cccccc #e0d9c8
~ border-soft #e0e0e0 #f0eadd
~ border-strong #888888 #c8bea8
~ success #177a3a #3d8b62
~ warning #a06200 #c5832e
~ danger #cf202f #a93535
~ info #2a64a6 #1f2a44
+ bg-soft #f5efe5
+ bg-warm #fdf9f2
+ brand-hover #8d6232
+ brand-pressed #6e4d27
+ brand-deep #553c1e
+ brand-tint #f5e9d4
+ on-brand #ffffff
+ navy #1f2a44
+ navy-deep #141d33
+ navy-soft rgba(31, 42, 68, 0.06)
+ text-on-brand #ffffff
+ selected-bg #f5e9d4
+ border-brand #a4793f
bg-section #f5f5f5
bg-dark #000000
surface-quote #f5f0e6
brand-tagline #000000
brand-red #cf202f
brand-red-hover #a8001a
brand-red-soft #ffe5e7
link-visited #5a5a5a
on-brand-red #ffffff
on-ink #ffffff
border-rule #000000
border-rule-heavy #000000
shadow-card rgba(0,0,0,0.04)
shadow-elev rgba(0,0,0,0.08)
shadow-modal rgba(0,0,0,0.18)
scrim rgba(0,0,0,0.55)
success-soft #e3f2e7
warning-soft #faf0db
danger-soft #ffe5e7
info-soft #e3edf7
live-red #cf202f
live-pulse #ff3344
democracy-tagline-bg #000000
typography 5 changed
~ display {"family":"Postoni","size":72} {"family":"Caudex","size":80}
~ h1 {"family":"Postoni","size":28} {"family":"Caudex","size":36}
~ h2 {"family":"Postoni","size":22} {"family":"Caudex","size":28}
~ body {"family":"Franklin ITC","size":18} {"family":"Avenir Next","size":16}
~ label {"family":"Courier New","size":11} {"family":"SFMono-Regular","size":12}
radius 1 changed
~ card 14px 6px
spacing 1 changed
~ xs 2px 0px
↻ Swap direction · Marriott → The Washington Post