Diff

Wikipedia vs v0

60 token-level differences between these two design systems.

Role tokens
Background
#ffffff #fafafa
Text
#202122 #262626
Brand
#3366cc #000000
Border
#a2a9b1 rgba(0, 0, 0, 0.078)
Display font
Linux Libertine GeistSans
Body size
14px 14px
colors 48 changed
~ bg #ffffff #fafafa
~ surface #ffffff #f2f2f2
~ surface-soft #f8f9fa #f0f0f0
~ surface-strong #eaecf0 #e6e6e6
~ brand #3366cc #000000
~ brand-deep #162d56 #000000
~ text #202122 #262626
~ text-strong #101114 #000000
~ text-muted #54595d #7c7c7c
~ text-soft #72777d #bababa
~ text-faint #a2a9b1 #cfcfcf
~ link #3366cc #000000
~ link-hover #447ff5 #525252
~ selected-bg #dde6f0 #f2f2f2
~ border #a2a9b1 rgba(0, 0, 0, 0.078)
~ border-strong #54595d rgba(0, 0, 0, 0.14)
+ bg-pure #ffffff
+ text-medium #525252
+ text-deep #969696
+ brand-soft rgba(0, 0, 0, 0.08)
+ disabled #bababa
+ border-subtle rgba(0, 0, 0, 0.05)
+ border-focus #000000
+ success-bg #f0f7f1
+ success-text #1f6b3e
+ warning-bg #fef6e4
+ warning-text #7a5a14
+ danger-bg #fbebec
+ danger-text #9a2c34
+ info-bg #f2f2f2
+ info-text #262626
bg-soft #f8f9fa
bg-warm #fefefe
brand-hover #2a4b91
brand-pressed #1f3870
brand-tint #dde6f0
text-on-brand #ffffff
link-visited #795cb2
link-red #dd3333
border-soft #eaecf0
border-brand #3366cc
infobox-header #eaecf0
citation-needed-orange #cc6633
stub-template #cee0f5
success #14866d
warning #fc3
danger #dd3333
info #3366cc
typography 5 changed
~ display {"family":"Linux Libertine","size":48} {"family":"GeistSans","size":48}
~ h1 {"family":"Linux Libertine","size":28} {"family":"GeistSans","size":32}
~ h2 {"family":"Linux Libertine","size":22} {"family":"GeistSans","size":24}
~ body {"family":"Linux Libertine","size":14} {"family":"GeistSans","size":14}
~ label {"family":"Inconsolata","size":12} {"family":"GeistMono","size":12}
radius 2 changed
~ button 4px 6px
~ card 14px 12px
spacing 5 changed
~ xs 0px 1px
~ sm 4px 2px
~ md 12px 6px
~ lg 24px 12px
~ xl 40px 20px
↻ Swap direction · v0 → Wikipedia