Diff

Notion vs Adobe

59 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#000000e6 #000000
Brand
#0075de #fa0f00
Border
#0000001a #eaeaea
Display font
NotionInter Adobe Clean
Body size
16px 16px
colors 53 changed
~ bg-soft #fbfaf9 #f5f5f5
~ surface #f6f5f4 #fafafa
~ surface-hover #dfdcd9 #f0f1f2
~ text #000000e6 #000000
~ text-strong #000000f2 #000000
~ text-muted #0000008a #53575b
~ text-faint #00000061 #6e6e6e
~ brand #0075de #fa0f00
~ brand-hover #005bab #d40b00
~ accent #62aef0 #1473e6
~ accent-strong #097fe8 #0265dc
~ border #0000001a #eaeaea
~ border-strong #00000033 #cacaca
~ success #0a8754 #268e6c
~ warning #a06b00 #e68619
~ warning-bg #fdf3e0 #fff3e0
~ danger #a02b1d #d7373f
~ danger-bg #fbeae8 #fce9ea
~ info #0075de #1473e6
~ info-bg #e6f3fe #e1f0ff
+ bg-deep #1d1d1d
+ bg-creative #000000
+ surface-raised #ffffff
+ text-body #2c2c2c
+ text-on-deep #ffffff
+ brand-magenta #ff0f5b
+ brand-orange #ff7a00
+ brand-deep #b30b00
+ accent-soft #e1f0ff
+ product-photoshop #31a8ff
+ product-illustrator #ff9a00
+ product-premiere #9999ff
+ product-acrobat #b30b00
+ link #1473e6
+ link-hover #0265dc
+ border-subtle #f0f0f0
+ ring-focus #1473e6
+ shadow-tile rgba(0,0,0,0.08)
+ shadow-elevated rgba(0,0,0,0.16)
+ on-accent #ffffff
+ gradient-wordmark linear-gradient(135deg, #ff0f5b 0%, #fa0f00 50%, #ff7a00 100%)
bg-campaign #191918
surface-soft #f9f9f8
surface-strong #eeede8
surface-dark #28272a
text-display #000000
text-soft #00000096
text-on-dark #ffffff
text-on-dark-muted #ffffffb3
brand-active #00396b
brand-soft #e6f3fe
campaign-launch #455dd3
border-soft #00000014
typography 5 changed
~ display {"family":"NotionInter","size":80} {"family":"Adobe Clean","size":84}
~ h1 {"family":"NotionInter","size":48} {"family":"Adobe Clean","size":42}
~ h2 {"family":"NotionInter","size":40} {"family":"Adobe Clean","size":32}
~ body {"family":"NotionInter","size":16} {"family":"Adobe Clean","size":16}
~ label {"family":"iA Writer Mono","size":11} {"family":"Source Code Pro","size":13}
radius 1 changed
~ card 12px 8px
spacing identical
No differences.
↻ Swap direction · Adobe → Notion