Diff

Polygon vs Workday

71 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#0e0820 #1a1a1a
Brand
#8247e5 #f37721
Border
#e0d8ed #dcd9d4
Display font
Polygon Display Adelle Sans Workday
Body size
16px 16px
colors 62 changed
~ bg-soft #f5f3fa #f7f5f2
~ text #0e0820 #1a1a1a
~ text-on-dark-soft #a89cc7 rgba(255,255,255,0.78)
~ brand #8247e5 #f37721
~ brand-hover #6a35c4 #d65f0e
~ brand-active #522aa3 #a64909
~ brand-soft #8247e51a #fef4ec
~ border #e0d8ed #dcd9d4
~ border-soft #ebe6f4 #ebe7e0
~ border-strong #c9bcdd #a8a39b
~ scrim rgba(14,8,32,0.60) rgba(26,26,26,0.55)
~ link #8247e5 #0066b2
~ link-hover #6a35c4 #004a85
+ bg-section #f0ece6
+ bg-feature #1a1a1a
+ bg-warm-feature #3d2914
+ bg-footer #1a1a1a
+ bg-info #fef4ec
+ surface #ffffff
+ surface-soft #faf8f5
+ surface-elev #ffffff
+ brand-tint #fde0c4
+ brand-deep #a64909
+ charcoal #1a1a1a
+ ink #262626
+ text-strong #000000
+ text-soft #5a5a5a
+ text-faint #8c8c8c
+ success #3aa15a
+ success-soft #e7f4ec
+ warning #d97706
+ warning-soft #fff5e6
+ danger #c63030
+ danger-soft #fbeaea
+ info #0066b2
+ info-soft #e6f0f8
+ shadow-card rgba(26,26,26,0.08)
+ shadow-elev rgba(26,26,26,0.14)
+ shadow-deep rgba(0,0,0,0.20)
+ shadow-warm rgba(243,119,33,0.18)
bg-strong #ebe6f4
bg-dark #1a1233
bg-dark-elev #241844
bg-dark-deep #0e0820
surface-card #ffffff
surface-card-soft #f5f3fa
text-body #3a2f5a
text-muted #6b5d8a
text-subtle #9c92b5
brand-light #a875ee
brand-glow rgba(130,71,229,0.40)
accent-violet #5a3eff
accent-cyan #16c4d6
accent-pink #e74694
semantic-up #22c55e
semantic-up-soft #22c55e1a
semantic-down #ef4444
semantic-warning #f59e0b
semantic-info #8247e5
gradient-hero linear-gradient(135deg, #1a1233 0%, #2d1c5c 50%, #8247e5 100%)
gradient-card linear-gradient(135deg, rgba(130,71,229,0.10) 0%, rgba(130,71,229,0.02) 100%)
focus-ring rgba(130,71,229,0.40)
typography 5 changed
~ display {"family":"Polygon Display","size":72} {"family":"Adelle Sans Workday","size":80}
~ h1 {"family":"Polygon Display","size":40} {"family":"Adelle Sans Workday","size":44}
~ h2 {"family":"Polygon Display","size":32} {"family":"Adelle Sans Workday","size":36}
~ body {"family":"Inter","size":16} {"family":"Adelle Sans Workday","size":16}
~ label {"family":"JetBrains Mono","size":11} {"family":"JetBrains Mono","size":14}
radius 3 changed
~ button 12px 8px
~ card 16px 12px
~ pill 999px 9999px
spacing 1 changed
~ xl 64px 48px
↻ Swap direction · Workday → Polygon