Diff

Arc vs Y Combinator

68 token-level differences between these two design systems.

Role tokens
Background
#FFFCEC #ffffff
Text
#000000 #000000
Brand
#2404AA #f26625
Border
rgba(0, 0, 0, 0.12) #cccccc
Display font
Marlin Soft SQ Verlag
Body size
16px 16px
colors 60 changed
~ bg #FFFCEC #ffffff
~ surface #FFFFFF #ffffff
~ text-medium rgba(0, 0, 0, 0.8) #404040
~ text-soft rgba(0, 0, 0, 0.6) #525252
~ text-faint rgba(0, 0, 0, 0.45) #a0a0a0
~ text-muted rgba(0, 0, 0, 0.3) #cccccc
~ brand #2404AA #f26625
~ brand-deep #1A0388 #cc4f00
~ on-brand #FFFCEC #ffffff
~ cta-bg #FFFFFF #f26625
~ cta-text #2702C2 #ffffff
~ link #2404AA #000099
~ link-hover #3139FB #000066
~ selected-bg rgba(36, 4, 170, 0.08) #fff6f0
~ disabled rgba(0, 0, 0, 0.3) #cccccc
~ border rgba(0, 0, 0, 0.12) #cccccc
~ border-strong rgba(0, 0, 0, 0.20) #828282
~ border-subtle rgba(0, 0, 0, 0.06) #e6e6e6
~ success-bg #D7F0D2 #e8f5e0
~ success-text #1F4D24 #2d5016
~ warning-bg #FFF1A8 #fff4d6
~ warning-text #7A5A00 #7a5e00
~ danger-bg #FFE3E6 #fde0d4
~ danger-text #A8112A #8a2a0a
~ info-bg #D1E2FF #e0e8f5
~ info-text #1A2B6B #000099
+ bg-paste #f6f6ef
+ bg-warm-tint #fff6f0
+ bg-cool #fafafa
+ surface-elevated #ffffff
+ text-meta #828282
+ brand-classic #ff6600
+ brand-hover #e85d00
+ brand-soft rgba(242, 102, 37, 0.10)
+ accent-startup-school #ff8c42
+ accent-warm-cream #fff6f0
+ link-visited #828282
+ link-yc #000000
+ ink-100 #000000
+ ink-200 #404040
+ ink-300 #525252
+ ink-400 #828282
+ ink-500 #a0a0a0
+ ink-600 #cccccc
+ ink-700 #e6e6e6
+ ink-800 #f6f6ef
+ border-orange rgba(242, 102, 37, 0.40)
+ shadow-color rgba(0, 0, 0, 0.06)
+ shadow-warm rgba(242, 102, 37, 0.15)
bg-secondary #FFF8DC
surface-elev #FFFEF7
brand-blue #3139FB
brand-red #FB3A4D
brand-coral-soft #FFE3E6
swatch-pale-green #D7F0D2
swatch-salmon #FFD9CF
swatch-pale-yellow #FFF1A8
swatch-soft-blue #D1E2FF
swatch-lavender #E6DCFF
border-brand rgba(36, 4, 170, 0.30)
typography 5 changed
~ display {"family":"Marlin Soft SQ","size":64} {"family":"Verlag","size":80}
~ h1 {"family":"Marlin Soft SQ","size":46} {"family":"Verlag","size":48}
~ h2 {"family":"Marlin Soft SQ","size":36} {"family":"Verlag","size":32}
~ body {"family":"Marlin","size":16} {"family":"Verdana","size":16}
~ label {"family":"ABC Favorit Mono","size":11} {"family":"Monaco","size":11}
radius 3 changed
~ button 10px 0px
~ card 16px 0px
~ pill 9999px 0px
spacing identical
No differences.
↻ Swap direction · Y Combinator → Arc