Diff

Glean vs Gemini (Google)

53 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#333333 #1f1f1f
Brand
#343ced #1a73e8
Border
#e6e6ea #dadce0
Display font
PolySans Neutral Google Sans Display
Body size
16px 16px
colors 45 changed
~ surface #f5f5f7 #eef2f7
~ text #333333 #1f1f1f
~ text-muted #6b6b73 #5f6368
~ brand #343ced #1a73e8
~ brand-hover #2a31cc #1967d2
~ brand-soft #ebecff #e8f0fe
~ brand-deep #29246a #185abc
~ border #e6e6ea #dadce0
~ border-strong #d2d2d8 #bdc1c6
~ success #058a5e #188038
~ success-bg #e6f5ee #e6f4ea
~ warning #9a6b00 #f29900
~ warning-bg #fbf2dc #fef7e0
~ danger #b42318 #d93025
~ danger-bg #fdeceb #fce8e6
~ info #343ced #1a73e8
~ info-bg #ebecff #e8f0fe
+ bg-soft #f8fafd
+ surface-high #dde3ea
+ surface-highest #cdd2da
+ surface-tinted #e7eef9
+ surface-violet-tinted #f3eafa
+ text-strong #0f0f0f
+ text-soft #80868b
+ text-disabled #bdc1c6
+ text-on-tinted #0b57d0
+ brand-press #185abc
+ gradient-from #4285f4
+ gradient-via #9b72cb
+ gradient-to #d96570
+ gradient-via-2 #9168c0
+ accent-violet #9168c0
+ accent-coral #d96570
+ accent-soft-blue #e8f0fe
+ accent-soft-violet #f3eafa
+ border-soft #e8eaed
+ border-focus #1a73e8
+ on-tonal #0b57d0
+ on-surface-tonal #1f1f1f
+ scrim rgba(32,33,36,0.4)
+ ring-focus rgba(26,115,232,0.32)
surface-soft #fafafa
text-heading #0a0227
text-faint #9a9aa2
brand-sampled #343bed
typography 5 changed
~ display {"family":"PolySans Neutral","size":72} {"family":"Google Sans Display","size":64}
~ h1 {"family":"PolySans Neutral","size":56} {"family":"Google Sans Display","size":48}
~ h2 {"family":"PolySans Neutral","size":40} {"family":"Google Sans Display","size":36}
~ body {"family":"PolySans Neutral","size":16} {"family":"Google Sans Text","size":16}
~ label {"family":"SFMono-Regular","size":13} {"family":"Google Sans Mono","size":13}
radius 1 changed
~ card 12px 24px
spacing 2 changed
~ lg 32px 24px
~ xl 64px 40px
↻ Swap direction · Gemini (Google) → Glean