Diff

Deno vs KAYAK

92 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#000000 #1e2026
Brand
#70ffaf #ff690f
Border
#e1e3e7 #dadde0
Display font
Inter Display Open Sans
Body size
17px 14px
colors 86 changed
~ surface-strong #f4f5f7 #e8e8e8
~ text #000000 #1e2026
~ text-strong #000000 #0a0c10
~ text-muted #5b5e64 #5e6470
~ brand #70ffaf #ff690f
~ brand-deep #10b981 #7a3300
~ link-hover #004999 #004a99
~ link-visited #553c9a #5a4392
~ border #e1e3e7 #dadde0
~ border-strong #c3c6ca #a4a9b4
~ divider #e8eaed #dadde0
+ bg-alt #f8f8f8
+ bg-data #f0f3f5
+ surface-soft #f4f4f4
+ surface-orange-soft #fff2e8
+ surface-graph #fdf3eb
+ surface-deal #fff2e8
+ text-body #2c2f36
+ text-soft #8a909d
+ text-on-brand #ffffff
+ text-on-orange #ffffff
+ brand-hover #e85a07
+ brand-active #c54a00
+ brand-light #fff2e8
+ brand-graph #ff690f
+ brand-graph-fill #fdf3eb
+ border-soft #eaecef
+ border-input-focus #ff690f
+ scrim rgba(0,0,0,0.5)
+ shadow-card rgba(0,0,0,0.06)
+ shadow-elev rgba(0,0,0,0.14)
+ shadow-deep rgba(255,105,15,0.18)
+ success #0a8c3e
+ success-soft #e8f6ee
+ success-deep #0a6b32
+ warning #d97706
+ warning-soft #fff7e6
+ danger #cc2935
+ danger-soft #fdeaec
+ info #0066cc
+ info-soft #e8f0f8
+ best-flag #0a8c3e
+ cheapest-flag #0a8c3e
+ fastest-flag #9333ea
+ short-stop-flag #0066cc
+ hacker-fare #ff690f
+ pricegraph-stroke #ff690f
+ pricegraph-fill #fdf3eb
+ pricegraph-low #0a8c3e
+ pricegraph-high #cc2935
bg-soft #f8f9fa
bg-strong #f4f5f7
surface-muted #e8eaed
text-faint #8c8f95
text-disabled #b8babf
brand-strong #34d399
brand-soft #dcfce7
brand-faint #f0fdf4
accent #000000
accent-warm #f59e0b
accent-warm-soft #fef3c7
selected #dcfce7
disabled-bg #f4f5f7
disabled-text #b8babf
border-subtle #eef0f2
inverse-bg #0d1117
inverse-text #e6e6e6
inverse-text-muted #8b949e
inverse-border #30363d
shadow-soft rgba(0, 0, 0, 0.04)
shadow-standard rgba(0, 0, 0, 0.08)
shadow-mint rgba(112, 255, 175, 0.32)
success-bg #dcfce7
success-text #166534
success-border #86efac
warning-bg #fef3c7
warning-text #854d0e
warning-border #fbbf24
danger-bg #fee2e2
danger-text #991b1b
danger-border #fca5a5
info-bg #dbeafe
info-text #1e3a8a
info-border #93c5fd
on-brand #000000
on-accent-warm #000000
typography 5 changed
~ display {"family":"Inter Display","size":88} {"family":"Open Sans","size":72}
~ h1 {"family":"Inter Display","size":48} {"family":"Open Sans","size":40}
~ h2 {"family":"Inter Display","size":36} {"family":"Open Sans","size":32}
~ body {"family":"Inter","size":17} {"family":"Open Sans","size":14}
~ label {"family":"JetBrains Mono","size":11} {"family":"SFMono-Regular","size":11}
radius 1 changed
~ card 12px 8px
spacing identical
No differences.
↻ Swap direction · KAYAK → Deno