Diff

Black Forest Labs vs Wikipedia

65 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#07130e #202122
Brand
#07130e #3366cc
Border
#000000 #a2a9b1
Display font
Instrument Sans Linux Libertine
Body size
16px 14px
colors 56 changed
~ text #07130e #202122
~ text-faint #a8ada9 #a2a9b1
~ brand #07130e #3366cc
~ link #07130e #3366cc
~ link-hover #000000 #447ff5
~ border #000000 #a2a9b1
~ border-soft rgba(7, 19, 14, 0.12) #eaecf0
~ success #1f6f4a #14866d
~ warning #9a6a1f #fc3
~ danger #9a2b2b #dd3333
+ bg-soft #f8f9fa
+ bg-warm #fefefe
+ surface-soft #f8f9fa
+ surface-strong #eaecf0
+ brand-hover #2a4b91
+ brand-pressed #1f3870
+ brand-deep #162d56
+ brand-tint #dde6f0
+ text-strong #101114
+ text-muted #54595d
+ text-soft #72777d
+ text-on-brand #ffffff
+ link-visited #795cb2
+ link-red #dd3333
+ selected-bg #dde6f0
+ border-strong #54595d
+ border-brand #3366cc
+ infobox-header #eaecf0
+ citation-needed-orange #cc6633
+ stub-template #cee0f5
+ info #3366cc
bg-ink #07130e
bg-pure-black #000000
surface-ink #07130e
surface-muted #f5f5f4
text-on-ink #ffffff
text-secondary #4a544f
text-tertiary #7d847f
text-on-ink-soft #b9b5d0
accent #b9b5d0
accent-soft rgba(185, 181, 208, 0.16)
focus #07130e
cta-bg #07130e
cta-text #ffffff
cta-bg-secondary #ffffff
cta-text-secondary #07130e
cta-bg-on-ink #ffffff
cta-text-on-ink #07130e
border-on-ink rgba(255, 255, 255, 0.16)
shadow-ambient rgba(7, 19, 14, 0.04)
shadow-card rgba(7, 19, 14, 0.06)
shadow-deep rgba(7, 19, 14, 0.12)
scrim rgba(7, 19, 14, 0.60)
success-soft rgba(31, 111, 74, 0.10)
warning-soft rgba(154, 106, 31, 0.10)
danger-soft rgba(154, 43, 43, 0.10)
typography 5 changed
~ display {"family":"Instrument Sans","size":90} {"family":"Linux Libertine","size":48}
~ h1 {"family":"Instrument Sans","size":40} {"family":"Linux Libertine","size":28}
~ h2 {"family":"Instrument Sans","size":32} {"family":"Linux Libertine","size":22}
~ body {"family":"Instrument Sans","size":16} {"family":"Linux Libertine","size":14}
~ label {"family":"SFMono-Regular","size":13} {"family":"Inconsolata","size":12}
radius 2 changed
~ button 0px 4px
~ card 0px 14px
spacing 2 changed
~ lg 32px 24px
~ xl 64px 40px
↻ Swap direction · Wikipedia → Black Forest Labs