Diff

LiveKit vs Height

57 token-level differences between these two design systems.

Role tokens
Background
#0a0a0a #fdfcf9
Text
#ffffff #0e0e10
Brand
#1fd5f9 #7551dc
Border
#2a2a2a #e6e3da
Display font
displayFont Inter Display
Body size
16px 16px
colors 50 changed
~ bg #0a0a0a #fdfcf9
~ bg-soft #141414 #f7f6f1
~ surface #1a1a1a #f7f6f1
~ text #ffffff #0e0e10
~ text-body #a8a8a8 #272730
~ text-muted #7a7a7a #5a5a66
~ text-faint #5a5a5a #9a9aa3
~ brand #1fd5f9 #7551dc
~ brand-hover #0fb8de #6745c8
~ brand-active #0a9bbe #5a3bb2
~ brand-soft #0a3742 #ede7fb
~ on-brand #0a0a0a #ffffff
~ border #2a2a2a #e6e3da
~ border-soft #1f1f1f #efece4
~ link #1fd5f9 #3344c8
~ link-hover #0fb8de #2229a8
~ ring #1fd5f9 rgba(117, 81, 220, 0.45)
~ success #10b981 #2c8a52
~ warning #f59e0b #c69022
~ danger #ef4444 #cb3946
~ info #1fd5f9 #3344c8
+ bg-elev #ffffff
+ bg-strong #ebe9e1
+ bg-dark #0e0e10
+ bg-dark-elev #17171a
+ on-dark #fbfbf7
+ pastel-lavender #ede7fb
+ pastel-peach #fbe6d3
+ pastel-mint #d9efe1
+ pastel-butter #faf0c8
+ pastel-blush #f7d8da
+ pastel-sky #dbe8f8
+ border-strong #cfcbbf
+ shadow-tint rgba(20, 18, 30, 0.08)
+ shadow-deep rgba(20, 18, 30, 0.16)
+ success-soft #d9efe1
+ warning-soft #faf0c8
+ danger-soft #f7d8da
+ selection rgba(117, 81, 220, 0.18)
bg-elevated #1a1a1a
bg-light #ffffff
surface-hover #222222
surface-strong #2a2a2a
surface-on-light #f5f5f5
text-strong #ffffff
text-on-light #0a0a0a
brand-glow rgba(31, 213, 249, 0.25)
accent-magenta #ff45e6
accent-yellow #ffd000
border-on-light #e0e0e0
typography 5 changed
~ display {"family":"displayFont","size":72} {"family":"Inter Display","size":72}
~ h1 {"family":"displayFont","size":40} {"family":"Inter Display","size":40}
~ h2 {"family":"displayFont","size":32} {"family":"Inter Display","size":32}
~ body {"family":"Public Sans","size":16} {"family":"Inter","size":16}
~ label {"family":"JetBrainsMono","size":11} {"family":"Berkeley Mono","size":16}
radius 2 changed
~ button 6px 10px
~ card 8px 14px
spacing identical
No differences.
↻ Swap direction · Height → LiveKit