Diff

Wikipedia vs Booking.com

47 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#202122 #262626
Brand
#3366cc #003580
Border
#a2a9b1 #e0e0e0
Display font
Linux Libertine Inter
Body size
14px 14px
colors 40 changed
~ bg-soft #f8f9fa #f5f5f5
~ bg-warm #fefefe #fefdf6
~ surface-soft #f8f9fa #fafafa
~ surface-strong #eaecf0 #f0f2f5
~ brand #3366cc #003580
~ brand-hover #2a4b91 #0066cc
~ brand-pressed #1f3870 #002566
~ brand-deep #162d56 #001a4d
~ brand-tint #dde6f0 #e8f0fa
~ text #202122 #262626
~ text-strong #101114 #000000
~ text-muted #54595d #595959
~ text-soft #72777d #8a8a8a
~ text-faint #a2a9b1 #bcbcbc
~ link #3366cc #0066cc
~ link-hover #447ff5 #003580
~ selected-bg #dde6f0 #e8f0fa
~ border #a2a9b1 #e0e0e0
~ border-strong #54595d #bdbdbd
~ border-soft #eaecf0 #eeeeee
~ border-brand #3366cc #003580
~ success #14866d #008009
~ warning #fc3 #d68500
~ danger #dd3333 #d63333
~ info #3366cc #0066cc
+ brand-soft #cee0f0
+ yellow #febb02
+ yellow-deep #cc9700
+ yellow-soft #fff4d4
+ text-on-yellow #262626
+ rating-good #008009
+ rating-superb #003580
+ urgency #d63333
+ urgency-soft #fff0f0
+ genius-purple #562155
link-visited #795cb2
link-red #dd3333
infobox-header #eaecf0
citation-needed-orange #cc6633
stub-template #cee0f5
typography 5 changed
~ display {"family":"Linux Libertine","size":48} {"family":"Inter","size":48}
~ h1 {"family":"Linux Libertine","size":28} {"family":"Inter","size":24}
~ h2 {"family":"Linux Libertine","size":22} {"family":"Inter","size":20}
~ body {"family":"Linux Libertine","size":14} {"family":"Inter","size":14}
~ label {"family":"Inconsolata","size":12} {"family":"SFMono-Regular","size":12}
radius 2 changed
~ button 4px 6px
~ card 14px 8px
spacing identical
No differences.
↻ Swap direction · Booking.com → Wikipedia