Diff

Glif vs Bun

66 token-level differences between these two design systems.

Role tokens
Background
#fcfaf6 #fbf0df
Text
#0e0e10 #15151b
Brand
#2e9e4f #f472b6
Border
#0000000f #15151b1a
Display font
Manrope CoFo Sans
Body size
16px 17px
colors 57 changed
~ bg #fcfaf6 #fbf0df
~ bg-soft #f6f3ec #fff7e8
~ text #0e0e10 #15151b
~ text-muted #55555a #6b6b6b
~ text-faint #b8b8be #9a9a9a
~ brand #2e9e4f #f472b6
~ brand-soft #e6f4ea #fce7f3
~ on-brand #fffaef #15151b
~ border #0000000f #15151b1a
~ border-strong #0000001f #15151b33
~ border-subtle #00000008 #15151b0d
~ success-bg #e6f4ea #dcfce7
~ warning-bg #fdf2dc #fef3c7
~ danger-bg #fbe7e7 #fee2e2
~ info-bg #e6f4ea #fce7f3
+ bg-strong #f5e8d0
+ surface-strong #fdfaf2
+ brand-strong #db2777
+ brand-faint #fdf2f8
+ accent #fbbf24
+ accent-strong #f59e0b
+ accent-soft #fef3c7
+ link #db2777
+ link-hover #9d174d
+ selected #fce7f3
+ disabled-bg #f5e8d0
+ disabled-text #9a9a9a
+ 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
bg-elev #f1ede4
surface-2 #f6f3ec
surface-3 #ebe6db
text-soft #86868c
brand-hover #28893f
brand-active #22742f
accent-warm #fffbf6
accent-warm-deep #f3ece0
accent-lilac #efeaff
accent-sky #e6f1fb
border-focus #2e9e4f
success #2e9e4f
warning #d98a00
danger #d83a3a
info #2e9e4f
typography 5 changed
~ display {"family":"Manrope","size":80} {"family":"CoFo Sans","size":96}
~ h1 {"family":"Manrope","size":54} {"family":"CoFo Sans","size":52}
~ h2 {"family":"Manrope","size":40} {"family":"CoFo Sans","size":40}
~ body {"family":"Manrope","size":16} {"family":"Inter","size":17}
~ label {"family":"SFMono-Regular","size":13} {"family":"Berkeley Mono","size":11}
radius 1 changed
~ button 8px 6px
spacing 3 changed
~ xs 0px 2px
~ lg 32px 24px
~ xl 64px 40px
↻ Swap direction · Bun → Glif