Diff

Axiom vs ClickHouse

58 token-level differences between these two design systems.

Role tokens
Background
#0a0e1a #0a0a0a
Text
#ffffff #ffffff
Brand
#1aaaff #faff69
Border
#ffffff14 #2a2a2a
Display font
Inter Inter
Body size
16px 16px
colors 58 changed
~ bg #0a0e1a #0a0a0a
~ bg-deep #03050a #000000
~ surface #161d33 #1a1a1a
~ surface-elevated #1a2240 #242424
~ text-strong #ffffff #e6e6e6
~ text-muted #b8c0d4 #888888
~ text-faint #4a5575 #5a5a5a
~ brand #1aaaff #faff69
~ brand-active #0c7ec0 #e6eb52
~ on-brand #ffffff #0a0a0a
~ link #1aaaff #faff69
~ link-hover #5cc4ff #e6eb52
~ border #ffffff14 #2a2a2a
~ border-strong #ffffff28 #3a3a3a
~ shadow-color rgba(3, 5, 10, 0.50) rgba(0,0,0,0)
~ info #1aaaff #3b82f6
+ surface-soft #121212
+ surface-yellow-band #faff69
+ text-body #cccccc
+ brand-disabled #3a3a1f
+ on-dark #ffffff
+ border-yellow #faff69
+ shadow-glow-yellow rgba(250,255,105,0.15)
+ accent-emerald #22c55e
+ accent-rose #ef4444
+ accent-blue #3b82f6
bg-soft #06080f
bg-elevated #111729
surface-hover #1d2540
surface-active #243057
text-soft #7a86a3
text-on-brand #ffffff
text-on-light #0a0e1a
brand-hover #0e8ed8
brand-soft #0a3050
brand-deep #063052
brand-light #5cc4ff
accent-cyan #1aaaff
accent-violet #9c5cff
accent-green #22c55e
accent-amber #f59e0b
accent-red #ef4444
accent-pink #ec4899
border-soft #ffffff0a
border-brand #1aaaff
shadow-color-md rgba(3, 5, 10, 0.65)
shadow-color-lg rgba(3, 5, 10, 0.80)
shadow-glow-cyan rgba(26, 170, 255, 0.20)
log-info #1aaaff
log-warn #f59e0b
log-error #ef4444
log-success #22c55e
code-bg #06080f
code-keyword #9c5cff
code-string #22c55e
code-comment #7a86a3
code-number #f59e0b
code-operator #1aaaff
typography identical
No differences.
radius identical
No differences.
spacing identical
No differences.
↻ Swap direction · ClickHouse → Axiom