Diff

Southwest Airlines vs Wispr Flow

59 token-level differences between these two design systems.

Role tokens
Background
#f4f4f4 #ffffeb
Text
#000000 #1a1a1a
Brand
#ffbf27 #f0d7ff
Border
#000000 #1a1a1a4d
Display font
Southwest Sans EB Garamond
Body size
16px 16px
colors 55 changed
~ bg #f4f4f4 #ffffeb
~ surface #f4f4f4 #034f46
~ surface-soft #ebebeb #e4e4d0
~ text #000000 #1a1a1a
~ text-muted #565656 #666666
~ text-soft #767676 #888888
~ brand #ffbf27 #f0d7ff
~ on-brand #111b40 #1a1a1a
~ border #000000 #1a1a1a4d
~ border-soft #d4d4d4 #1a1a1a1a
~ border-strong #000000 #1a1a1a80
~ scrim rgba(17,27,64,0.55) rgba(17,17,10,0.50)
~ shadow-card rgba(17,27,64,0.08) rgba(26,26,15,0.05)
~ shadow-elev rgba(17,27,64,0.16) rgba(26,26,15,0.10)
~ success #1a7a3c #114e0b
~ success-soft #e6f4ec #cef5ca
~ warning #b25f00 #5e5515
~ warning-soft #fff4e3 #fcf8d8
~ danger #c4123c #7f1c34
~ danger-soft #fdeef1 #f8e4e4
+ bg-dark #e4e4d0
+ text-darkest #111111
+ on-surface #ffffeb
+ brand-ink #1a1a1a
+ accent-glow #ffa946
+ accent-fathom #034f46
+ accent-pulse #7f1c34
+ white #ffffff
+ focus-state #2d62ff
bg-alt #ffffff
surface-white #ffffff
surface-navy #111b40
surface-blue #304cb2
surface-yellow-soft #fff6dd
text-body #1a1a1a
text-on-brand #111b40
text-on-navy #ffffff
text-on-blue #ffffff
brand-hover #f0b01c
brand-active #dca110
blue #304cb2
blue-hover #26409c
blue-active #1d3380
navy #111b40
navy-2 #1a2a5e
red-heart #d31245
link #304cb2
link-hover #26409c
link-visited #5a3a9e
border-focus #304cb2
divider #d4d4d4
shadow-deep rgba(17,27,64,0.24)
info #304cb2
info-soft #eaeefb
star-rating #ffbf27
typography 4 changed
~ display {"family":"Southwest Sans","size":80} {"family":"EB Garamond","size":120}
~ h1 {"family":"Southwest Sans","size":40} {"family":"EB Garamond","size":48}
~ h2 {"family":"Southwest Sans","size":32} {"family":"EB Garamond","size":36}
~ body {"family":"Southwest Sans","size":16} {"family":"Figtree","size":16}
radius identical
No differences.
spacing identical
No differences.
↻ Swap direction · Wispr Flow → Southwest Airlines