Diff

Audi vs Weaviate

70 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#333333 #0f0a3a
Brand
#000000 #1cdb46
Border
#d6d6d6 #e0e2eb
Display font
AudiType Inter
Body size
16px 16px
colors 66 changed
~ bg-soft #f2f2f2 #f8f9fb
~ surface-soft #f2f2f2 #f1f3f7
~ text #333333 #0f0a3a
~ text-strong #000000 #1a1547
~ text-muted #666666 #6e6b8c
~ text-faint #999999 #9a98b1
~ brand #000000 #1cdb46
~ brand-deep #000000 #0a6b1f
~ on-brand #ffffff #0f0a3a
~ border #d6d6d6 #e0e2eb
~ border-strong #a6a6a6 #c5c8d4
~ border-soft #e6e6e6 #f1f3f7
~ link #000000 #1cdb46
~ link-hover #bb0a30 #0f9e2f
~ success #1f8b46 #1cdb46
~ warning #f0a020 #f59e0b
~ danger #bb0a30 #ef4444
~ info #0062c0 #06b6d4
+ bg-deep #130c49
+ surface-elevated #ffffff
+ surface-green #e6fae9
+ surface-indigo #eaeaf5
+ surface-dark #130c49
+ surface-dark-card #1f1860
+ text-body #3d3a6b
+ text-on-dark #ffffff
+ text-on-dark-muted #c4c2d6
+ brand-hover #15b939
+ brand-active #0f9e2f
+ brand-soft #e6fae9
+ brand-indigo #130c49
+ on-light #0f0a3a
+ border-green #1cdb46
+ shadow-color rgba(19, 12, 73, 0.04)
+ shadow-color-md rgba(19, 12, 73, 0.08)
+ shadow-color-lg rgba(19, 12, 73, 0.12)
+ accent-amber #f59e0b
+ accent-rose #ef4444
+ accent-cyan #06b6d4
+ accent-violet #8b5cf6
+ code-keyword #0f9e2f
+ code-string #0a6b1f
+ code-comment #9a98b1
+ code-number #f59e0b
bg-card #ffffff
bg-strong #e6e6e6
bg-dark #000000
bg-dark-elev #1a1a1a
bg-dark-card #262626
surface-card #ffffff
surface-table #fafafa
text-ink #000000
brand-on-light #000000
brand-disabled #cccccc
on-dark #ffffff
on-dark-soft #bcbcbc
on-dark-faint #808080
accent-red #bb0a30
accent-red-deep #8d0623
accent-progress-blue #0062c0
border-on-dark rgba(255,255,255,0.16)
border-on-dark-strong rgba(255,255,255,0.32)
ring #000000
shadow-soft rgba(0,0,0,0.06)
shadow-elev rgba(0,0,0,0.14)
shadow-deep rgba(0,0,0,0.36)
typography 4 changed
~ display {"family":"AudiType","size":80} {"family":"Inter","size":72}
~ h1 {"family":"AudiType","size":40} {"family":"Inter","size":40}
~ h2 {"family":"AudiType","size":32} {"family":"Inter","size":32}
~ body {"family":"AudiType","size":16} {"family":"Inter","size":16}
radius identical
No differences.
spacing identical
No differences.
↻ Swap direction · Weaviate → Audi