Diff

Accenture vs Graza

53 token-level differences between these two design systems.

Role tokens
Background
#0a0a0a #f6e6d9
Text
#ffffff #3c422e
Brand
#a600ff #d1e030
Border
#2e2e2e #3c422e
Display font
Graphik GT Alpina Typewriter
Body size
16px 16px
colors 47 changed
~ bg #0a0a0a #f6e6d9
~ surface #141414 #fff4ec
~ surface-soft #1c1c1c #f6e6d9
~ text #ffffff #3c422e
~ text-muted #a3a3a3 #6b6f5d
~ brand #a600ff #d1e030
~ on-brand #ffffff #3c422e
~ border #2e2e2e #3c422e
~ link #ffffff #3c422e
~ link-hover #a600ff #d1e030
~ success #3ad29f #5a8a3c
~ warning #ffb800 #fbd535
~ danger #ff5252 #b3472d
~ info #a600ff #3c422e
+ bg-soft #fff4ec
+ bg-deeper #e8d6c8
+ brand-ink #3c422e
+ accent-mint #9eef80
+ accent-yellow #fbd535
+ accent-stroke #9fcd7a
+ cta-bg #d1e030
+ cta-text #3c422e
+ cta-cart-bg #fff4ec
+ cta-cart-text #3c422e
+ text-faint #9a9b8a
+ border-soft #9fcd7a
+ border-faint #e8d6c8
bg-pure #000000
surface-strong #262626
surface-light #ffffff
surface-light-soft #f2f2f2
text-strong #ffffff
text-body #e6e6e6
text-soft #6b6b6b
text-on-light #0a0a0a
text-on-light-mute #525252
brand-bright #be4bff
brand-deep #7d00c4
brand-soft rgba(166,0,255,0.12)
border-strong #4d4d4d
border-on-light #e0e0e0
focus #a600ff
scrim rgba(0,0,0,0.7)
success-soft rgba(58,210,159,0.14)
warning-soft rgba(255,184,0,0.14)
danger-soft rgba(255,82,82,0.14)
info-soft rgba(166,0,255,0.12)
typography 4 changed
~ display {"family":"Graphik","size":80} {"family":"GT Alpina Typewriter","size":80}
~ h1 {"family":"Graphik","size":40} {"family":"GT Alpina Typewriter","size":40}
~ h2 {"family":"Graphik","size":32} {"family":"GT Alpina Typewriter","size":32}
~ body {"family":"Graphik","size":16} {"family":"GT Alpina Typewriter","size":16}
radius 2 changed
~ button 8px 12px
~ card 12px 20px
spacing identical
No differences.
↻ Swap direction · Graza → Accenture