Diff

Liquid Death vs Our Place

51 token-level differences between these two design systems.

Role tokens
Background
#000000 #fcfaf6
Text
#ffffff #35312e
Brand
#ffffff #af5a3c
Border
#ffffff #e4dccb
Display font
Acumin Pro Chelt
Body size
16px 16px
colors 44 changed
~ bg #000000 #fcfaf6
~ surface #000000 #ffffff
~ brand #ffffff #af5a3c
~ text #ffffff #35312e
~ text-strong #ffffff #2a2724
~ text-muted #9ca3af #6b645c
~ link #ffffff #af5a3c
~ link-hover #9ca3af #8f4730
~ border #ffffff #e4dccb
~ border-soft #262626 #efe7d8
~ border-strong #ffffff #35312e
~ success #22c55e #5a7a4d
~ warning #f59e0b #c8861a
~ danger #ff0000 #a73b2b
~ info #007aff #5c707e
+ bg-soft #f6f1e8
+ bg-deeper #efe7d8
+ surface-soft #f6f1e8
+ brand-deep #8f4730
+ brand-soft #d8a087
+ on-brand #ffffff
+ cta-secondary-bg #ebe5d4
+ cta-secondary-text #35312e
+ text-faint #9a9189
+ text-on-image #ffffff
bg-page #000000
surface-raised #0a0a0a
surface-inverse #ffffff
brand-hover #e5e5e5
brand-active #cccccc
text-soft #6b7280
text-on-white #000000
text-on-brand #000000
border-input #ffffff
outline-focus #ffffff
scrim rgba(0,0,0,0.85)
shadow-card transparent
shadow-modal transparent
accent-electric #007aff
accent-blood #ff0000
cta-hell-yes-bg #000000
cta-hell-yes-text #ffffff
cta-contest-bg #ffffff
cta-contest-text #000000
typography 4 changed
~ display {"family":"Acumin Pro","size":96} {"family":"Chelt","size":80}
~ h1 {"family":"Acumin Pro","size":60} {"family":"Chelt","size":60}
~ h2 {"family":"Acumin Pro","size":48} {"family":"Chelt","size":40}
~ body {"family":"Acumin Pro","size":16} {"family":"Plaid-XS-Web","size":16}
radius 3 changed
~ button 0px 8px
~ card 0px 12px
~ pill 0px 9999px
spacing identical
No differences.
↻ Swap direction · Our Place → Liquid Death