Diff

Render vs Axios

78 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#373145 #333335
Brand
#8a05ff #0044a5
Border
#0000001a #e0e0e0
Display font
Inter Atiza
Body size
16px 18px
colors 71 changed
~ surface #fafafa #ffffff
~ surface-soft #e6daff #f5f5f5
~ brand #8a05ff #0044a5
~ brand-hover #6e04cc #003a8c
~ brand-deep #3d0270 #001f4d
~ link #8a05ff #0044a5
~ link-hover #6e04cc #003a8c
~ link-visited #6a04b8 #666668
~ text #373145 #333335
~ text-muted #5e5b6f #666668
~ text-soft #9089a0 #888889
~ text-faint #bcb6c8 #aaaab0
~ border #0000001a #e0e0e0
~ border-soft #0000000d #f0f0f0
~ border-strong #00000033 #999999
~ success #0a8754 #2a8a4f
~ warning #cc7400 #cc7a00
~ danger #d72638 #d6062b
~ info #8a05ff #0044a5
+ bg-section #ffffff
+ bg-section-newsletter #fafafa
+ bg-dark #1a1a1a
+ bg-darkest #000000
+ surface-strong #e8e8e8
+ surface-quote #f0f4fb
+ surface-blue-tint #e6eef9
+ text-strong #000000
+ text-on-blue #ffffff
+ text-on-dark #ffffff
+ brand-active #002e72
+ brand-soft #cfdaef
+ brand-secondary #d6062b
+ on-dark #ffffff
+ border-rule #000000
+ border-blue #0044a5
+ shadow-card rgba(0,0,0,0.06)
+ shadow-elev rgba(0,0,0,0.1)
+ shadow-modal rgba(0,0,0,0.3)
+ scrim rgba(0,0,0,0.6)
+ success-soft #dff0e7
+ warning-soft #fde9cc
+ danger-soft #fbd6dc
+ info-soft #cfdaef
+ time-bar #000000
+ time-bar-bg #f5f5f5
+ newsletter-banner #0044a5
bg-deep #fafafa
bg-elev-1 #f5f3fb
bg-elev-2 #ffffff
surface-glow #fbceff
surface-deep #f3eefe
brand-pressed #5a039f
brand-glow #8a05ff1f
accent #9d66ff
accent-hover #b08aff
accent-soft #e6daff
accent-glow #fbceff
selected #8a05ff14
disabled #e6e4ec
disabled-text #a8a4b4
text-heading #1f1a2e
text-disabled #a8a4b4
border-brand #8a05ff66
shadow-ambient rgba(55,49,69,0.06)
shadow-standard rgba(55,49,69,0.1)
shadow-elevated rgba(138,5,255,0.18)
shadow-glow rgba(251,206,255,0.5)
success-bg #dffaef
warning-bg #fff4e0
danger-bg #ffe5e8
info-bg #e6daff
typography 5 changed
~ display {"family":"Inter","size":88} {"family":"Atiza","size":72}
~ h1 {"family":"Inter","size":48} {"family":"Atiza","size":26}
~ h2 {"family":"Inter","size":36} {"family":"Atiza","size":22}
~ body {"family":"Inter","size":16} {"family":"Atiza","size":18}
~ label {"family":"JetBrains Mono","size":12} {"family":"NB International Pro Mono","size":11}
radius 2 changed
~ button 8px 4px
~ card 24px 6px
spacing identical
No differences.
↻ Swap direction · Axios → Render