Diff

Bun vs Fly.io

85 token-level differences between these two design systems.

Role tokens
Background
#fbf0df #24175b
Text
#15151b #fbf2e4
Brand
#f472b6 #7c3aed
Border
#15151b1a #ffffff1a
Display font
CoFo Sans Mackinac
Body size
17px 17px
colors 79 changed
~ bg #fbf0df #24175b
~ surface #ffffff #1f1748
~ text #15151b #fbf2e4
~ text-muted #6b6b6b #a89dc8
~ text-faint #9a9a9a #5b537a
~ brand #f472b6 #7c3aed
~ accent #fbbf24 #a78bfa
~ accent-soft #fef3c7 #7c3aed1f
~ link #db2777 #a78bfa
~ link-hover #9d174d #c4b5fd
~ selected #fce7f3 #7c3aed26
~ disabled-text #9a9a9a #6b5d8a
~ border #15151b1a #ffffff1a
~ border-strong #15151b33 #ffffff33
~ success-bg #dcfce7 #0f3a2a
~ warning-bg #fef3c7 #3a2710
~ danger-bg #fee2e2 #3a1818
~ info-bg #fce7f3 #1f1748
~ on-brand #15151b #ffffff
+ bg-deep #15103d
+ bg-cream #fbf2e4
+ bg-elev-1 #1f1748
+ bg-elev-2 #2a1f6b
+ surface-cream #f4ead7
+ surface-cream-deep #ede0c4
+ brand-hover #9061f5
+ brand-pressed #6929d4
+ brand-deep #5b21b6
+ brand-glow #7c3aed33
+ accent-hover #c4b5fd
+ accent-warm #f59e0b
+ accent-warm-soft #fbbf24
+ link-visited #8b6cd9
+ link-cream #5b21b6
+ disabled #3a2f5f
+ text-ink #15103d
+ text-heading #fbf2e4
+ text-soft #867aa8
+ text-disabled #6b5d8a
+ text-cream-heading #15103d
+ text-cream-body #2a1f4d
+ text-cream-muted #5b507a
+ border-soft #ffffff0d
+ border-ink #15103d33
+ border-ink-strong #15103d4d
+ border-brand #7c3aed66
+ shadow-ambient rgba(0,0,0,0.25)
+ shadow-standard rgba(15,16,61,0.4)
+ shadow-elevated rgba(15,16,61,0.55)
+ shadow-glow rgba(124,58,237,0.3)
+ success #34d399
+ warning #f59e0b
+ danger #f87171
+ info #a78bfa
bg-soft #fff7e8
bg-strong #f5e8d0
surface-strong #fdfaf2
text-strong #000000
brand-strong #db2777
brand-soft #fce7f3
brand-faint #fdf2f8
accent-strong #f59e0b
disabled-bg #f5e8d0
border-subtle #15151b0d
divider #15151b14
inverse-bg #15151b
inverse-text #fbf0df
inverse-text-muted #a1a1aa
shadow-warm rgba(21, 21, 27, 0.08)
shadow-pink rgba(244, 114, 182, 0.18)
success-text #166534
success-border #86efac
warning-text #854d0e
warning-border #fbbf24
danger-text #991b1b
danger-border #fca5a5
info-text #9d174d
info-border #f9a8d4
on-accent #15151b
typography 5 changed
~ display {"family":"CoFo Sans","size":96} {"family":"Mackinac","size":96}
~ h1 {"family":"CoFo Sans","size":52} {"family":"Mackinac","size":56}
~ h2 {"family":"CoFo Sans","size":40} {"family":"Mackinac","size":42}
~ body {"family":"Inter","size":17} {"family":"Fricolage Grotesque","size":17}
~ label {"family":"Berkeley Mono","size":11} {"family":"Fragment Mono","size":13}
radius 1 changed
~ card 12px 18px
spacing identical
No differences.
↻ Swap direction · Fly.io → Bun