Diff

Uniqlo vs Oura

58 token-level differences between these two design systems.

Role tokens
Background
#ffffff #000000
Text
#000000 #ffffff
Brand
#ff0000 #d6c283
Border
#dddddd #262626
Display font
Inter Inter
Body size
14px 16px
colors 54 changed
~ bg #ffffff #000000
~ surface #ffffff #0d0d0d
~ surface-soft #f7f7f7 #1a1a1a
~ surface-strong #eeeeee #262626
~ brand #ff0000 #d6c283
~ brand-hover #cc0000 #c4ae6a
~ brand-active #990000 #a8924f
~ brand-pale #ffe0e0 #ede4cb
~ brand-deep #990000 #7d6a3d
~ text #000000 #ffffff
~ text-strong #000000 #ffffff
~ text-muted #767676 #b5b5b5
~ text-soft #999999 #8a8a8a
~ link #000000 #ffffff
~ link-hover #000000 #d6c283
~ border #dddddd #262626
~ border-soft #eeeeee #1a1a1a
~ border-strong #000000 #3a3a3a
~ border-input #999999 #4d4d4d
~ scrim rgba(0,0,0,0.5) rgba(0,0,0,0.8)
~ shadow-card rgba(0,0,0,0.08) rgba(0,0,0,0.5)
~ success #0a8a3f #84d97e
~ warning #cc6600 #d9b67e
~ danger #cc0000 #d97e84
~ info #0064d2 #7eb8d9
+ bg-elev #0d0d0d
+ bg-elev-strong #1a1a1a
+ bg-light #ffffff
+ bg-cream #f5f0e6
+ brand-soft #1a1612
+ ring-titanium #8a8a8a
+ ring-rose-gold #c4847a
+ ring-stealth #3a3a3a
+ text-faint #666666
+ text-on-brand #000000
+ text-on-light #000000
+ score-readiness #84d97e
+ score-sleep #7eb8d9
+ score-activity #d9b67e
+ score-stress #d97e84
+ score-resilience #9c7ed9
+ shadow-elev rgba(0,0,0,0.7)
bg-page #ffffff
surface-grey #f4f4f4
bg-inverse #000000
text-on-red #ffffff
text-on-black #ffffff
outline-focus #000000
shadow-modal rgba(0,0,0,0.16)
warning-soft #fff4e5
rating-fill #ff0000
rating-empty #dddddd
sale-red #ff0000
member-red #ff0000
typography 2 changed
~ body {"family":"Inter","size":14} {"family":"Inter","size":16}
~ label {"family":"Monaco","size":11} {"family":"Inter","size":11}
radius 2 changed
~ button 4px 8px
~ card 8px 12px
spacing identical
No differences.
↻ Swap direction · Oura → Uniqlo