Diff

Lamborghini vs Turbo

74 token-level differences between these two design systems.

Role tokens
Background
#000000 #000000
Text
#ffffff #ffffff
Brand
#ffc000 #ff1e56
Border
rgba(255,255,255,0.5) rgba(255, 255, 255, 0.08)
Display font
LamboType Geist
Body size
16px 16px
colors 63 changed
~ surface #202020 #111111
~ text-soft #f5f5f5 #666666
~ brand #ffc000 #ff1e56
~ on-brand #000000 #ffffff
~ border rgba(255,255,255,0.5) rgba(255, 255, 255, 0.08)
~ success #5fa657 #0cce6b
~ warning #d4a017 #f5a623
~ danger #cc0033 #ff4d4f
~ info #29abe2 #0096ff
+ bg-soft #0a0a0a
+ surface-strong #1a1a1a
+ bg-overlay rgba(0, 0, 0, 0.72)
+ text-muted #a1a1a1
+ text-faint #444444
+ text-on-brand #ffffff
+ brand-strong #e6164a
+ brand-soft rgba(255, 30, 86, 0.12)
+ accent #0096ff
+ accent-strong #0078cc
+ accent-soft rgba(0, 150, 255, 0.12)
+ gradient-from #ff1e56
+ gradient-via #9b56b3
+ gradient-to #0096ff
+ glow-magenta rgba(255, 30, 86, 0.4)
+ glow-blue rgba(0, 150, 255, 0.35)
+ glow-soft rgba(255, 30, 86, 0.2)
+ border-strong rgba(255, 255, 255, 0.15)
+ border-subtle rgba(255, 255, 255, 0.05)
+ border-brand rgba(255, 30, 86, 0.4)
+ border-focus #ff1e56
+ success-bg rgba(12, 206, 107, 0.1)
+ warning-bg rgba(245, 166, 35, 0.1)
+ danger-bg rgba(255, 77, 79, 0.1)
+ info-bg rgba(0, 150, 255, 0.1)
+ on-accent #ffffff
+ on-surface #ffffff
+ on-bg #ffffff
bg-deep #181818
surface-overlay rgba(0,0,0,0.7)
surface-fog rgba(0,0,0,0.5)
surface-mist rgba(0,0,0,0.25)
surface-light #f8f8f8
surface-light-mist #e6e6e6
text-on-light #202020
text-on-light-strong #000000
text-graphite #494949
text-ash #7d7d7d
text-steel #969696
text-slate #666666
text-iron #555555
text-shadow #313131
brand-active #917300
brand-light #ffce3e
accent-cyan #29abe2
accent-link-blue #3860be
accent-teal-action #1eaedb
border-divider #202020
border-light-input #dddddd
ring #ffc000
link #ffffff
link-hover #3860be
hex-stroke #ffffff
progress-bar #ffffff
typography 5 changed
~ display {"family":"LamboType","size":72} {"family":"Geist","size":96}
~ h1 {"family":"LamboType","size":40} {"family":"Geist","size":64}
~ h2 {"family":"LamboType","size":32} {"family":"Geist","size":48}
~ body {"family":"LamboType","size":16} {"family":"Geist","size":16}
~ label {"family":"JetBrains Mono","size":12} {"family":"Geist Mono","size":12}
radius 2 changed
~ button 0px 8px
~ card 8px 12px
spacing 4 changed
~ xs 2px 0px
~ sm 4px 2px
~ lg 15px 20px
~ xl 20px 32px
↻ Swap direction · Turbo → Lamborghini