Diff

Disney+ vs Together AI

81 token-level differences between these two design systems.

Role tokens
Background
#0e1735 #fafafa
Text
#f9f9f9 #0f1f3d
Brand
#0089ec #0f1f3d
Border
#2a3170 #e5e7eb
Display font
Inspire Inter
Body size
16px 16px
colors 74 changed
~ bg #0e1735 #fafafa
~ surface #1a2151 #ffffff
~ surface-strong #2a3170 #e5e7eb
~ surface-soft #0a132a #f9fafb
~ text #f9f9f9 #0f1f3d
~ text-strong #ffffff #06091a
~ text-muted #a0a3a8 #5a627a
~ text-soft #737582 #7d839a
~ text-disabled #5c5e6b #a8aebd
~ brand #0089ec #0f1f3d
~ brand-hover #19a0ff #1a2d52
~ brand-deep #001f55 #080f1f
~ border #2a3170 #e5e7eb
~ border-soft #1f254a #f0f1f3
~ border-strong #0089ec #cbd0d8
~ shadow-card rgba(0,0,0,0.6) rgba(15,31,61,0.06)
~ success #00b89c #10b981
~ warning #ffa500 #f59e0b
~ danger #ff3b30 #ef4444
~ info #0089ec #0070f3
+ bg-pure #ffffff
+ bg-surface #f4f5f7
+ bg-promo #e7f0ff
+ surface-elevated #ffffff
+ surface-hover #f4f5f7
+ text-on-brand #ffffff
+ text-link #0070f3
+ text-link-hover #0058c2
+ brand-soft #27314e
+ accent-blue #0070f3
+ accent-blue-hover #0058c2
+ accent-blue-active #003e8c
+ accent-blue-soft #e7f0ff
+ accent-cyan #00d4ff
+ accent-purple #7c3aed
+ accent-green #10b981
+ accent-orange #f59e0b
+ accent-red #ef4444
+ border-focus #0070f3
+ code-bg-light #f4f5f7
+ code-bg-dark #1a1d29
+ code-text #e5e7eb
+ code-comment #7d839a
+ code-keyword #c084fc
+ code-string #86efac
+ code-function #60a5fa
+ code-variable #fcd34d
+ code-punct #a4adc8
+ code-number #fb923c
+ shadow-modal rgba(15,31,61,0.2)
+ shadow-popover rgba(15,31,61,0.12)
+ shadow-elevated rgba(15,31,61,0.10)
+ success-soft #d1fae5
+ warning-soft #fef3c7
+ danger-soft #fee2e2
+ info-soft #e7f0ff
bg-deep #040714
bg-gradient linear-gradient(180deg, #0e1735 0%, #1a2151 50%, #040714 100%)
surface-card transparent
surface-overlay rgba(14,23,53,0.85)
text-body #dcddde
brand-active #006bbd
brand-arc #0089ec
brand-purple #5750b0
star-yellow #f3c032
marvel-red #ed1d24
star-wars-yellow #ffe81f
pixar-blue #0080ff
natgeo-yellow #ffcc00
shadow-billboard rgba(0,0,0,0.85)
shadow-glow-blue rgba(0,137,236,0.4)
progress-watched #0089ec
progress-rail #3a3f5e
scrim-bottom linear-gradient(0deg, #0e1735 0%, transparent 100%)
typography 5 changed
~ display {"family":"Inspire","size":72} {"family":"Inter","size":64}
~ h1 {"family":"Inspire","size":40} {"family":"Inter","size":40}
~ h2 {"family":"Inspire","size":32} {"family":"Inter","size":32}
~ body {"family":"Inspire","size":16} {"family":"Inter","size":16}
~ label {"family":"SFMono-Regular","size":11} {"family":"JetBrains Mono","size":11}
radius 2 changed
~ button 8px 6px
~ card 12px 8px
spacing identical
No differences.
↻ Swap direction · Together AI → Disney+