Diff

Uniqlo vs Bluesky

64 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#000000 #0c0c0c
Brand
#ff0000 #0085ff
Border
#dddddd #dde1e7
Display font
Inter Inter
Body size
14px 15px
colors 60 changed
~ surface-soft #f7f7f7 #eef7ff
~ surface-strong #eeeeee #e8eaee
~ brand #ff0000 #0085ff
~ brand-hover #cc0000 #006cd9
~ brand-active #990000 #0057b3
~ brand-deep #990000 #0057b3
~ text #000000 #0c0c0c
~ text-muted #767676 #5e6772
~ text-soft #999999 #7a838e
~ border #dddddd #dde1e7
~ border-soft #eeeeee #eef0f3
~ border-strong #000000 #bcc1c9
~ shadow-card rgba(0,0,0,0.08) rgba(0,0,0,0.06)
~ shadow-modal rgba(0,0,0,0.16) rgba(0,0,0,0.20)
~ success #0a8a3f #2bb673
~ warning #cc6600 #f9a13e
~ warning-soft #fff4e5 #fff3e0
~ danger #cc0000 #e84545
~ info #0064d2 #0085ff
+ bg-warm #f8f9fa
+ bg-muted #f1f3f5
+ bg-promo #e8f4ff
+ surface-elevated #ffffff
+ surface-hover #f1f3f5
+ text-disabled #a8aebd
+ text-on-brand #ffffff
+ text-link #0085ff
+ text-link-hover #006cd9
+ brand-soft #e8f4ff
+ accent-pink #fb44a3
+ accent-purple #9a75e9
+ accent-yellow #f5c518
+ accent-orange #f9a13e
+ accent-red #e84545
+ accent-green #2bb673
+ border-focus #0085ff
+ on-brand #ffffff
+ reply-line #dde1e7
+ reaction-like #fb44a3
+ reaction-repost #9a75e9
+ reaction-reply #5e6772
+ shadow-popover rgba(0,0,0,0.12)
+ success-soft #e0f6ec
+ danger-soft #fdebeb
+ info-soft #e8f4ff
bg-page #ffffff
surface-grey #f4f4f4
bg-inverse #000000
brand-pale #ffe0e0
text-on-red #ffffff
text-on-black #ffffff
link #000000
link-hover #000000
border-input #999999
outline-focus #000000
scrim rgba(0,0,0,0.5)
rating-fill #ff0000
rating-empty #dddddd
sale-red #ff0000
member-red #ff0000
typography 3 changed
~ display {"family":"Inter","size":72} {"family":"Inter","size":56}
~ body {"family":"Inter","size":14} {"family":"Inter","size":15}
~ label {"family":"Monaco","size":11} {"family":"Roboto Mono","size":11}
radius 1 changed
~ button 4px 6px
spacing identical
No differences.
↻ Swap direction · Bluesky → Uniqlo