Diff

Roblox vs Honda

70 token-level differences between these two design systems.

Role tokens
Background
#ffffff #ffffff
Text
#191b1f #35363b
Brand
#ed1d24 #cc0000
Border
#e4e7eb #d8d8d8
Display font
Builder Sans HondaGlobalFontEN-Regular
Body size
14px 14px
colors 63 changed
~ surface #ffffff #f7f7f7
~ surface-strong #eaecf0 #e0e0e0
~ text #191b1f #35363b
~ text-strong #000000 #1a1a1a
~ text-muted #5c6770 #666666
~ text-faint #8b96a0 #999999
~ brand #ed1d24 #cc0000
~ brand-hover #d11017 #b30000
~ brand-active #a30c11 #990000
~ brand-deep #7a0a0d #7a0000
~ link-hover #d11017 #990000
~ border #e4e7eb #d8d8d8
~ border-soft #eaecf0 #ebebeb
~ border-strong #ed1d24 #999999
~ success #00b06f #00854a
~ warning #ff8a00 #ff8c00
~ danger #ed1d24 #cc0000
~ info #00a2ff #0066cc
+ bg-elevated #f7f7f7
+ bg-dark #000000
+ surface-hover #ededed
+ surface-on-dark #1a1a1a
+ text-display #000000
+ text-body #35363b
+ brand-soft #fceaea
+ accent-blue #0066cc
+ accent-yellow #ffd200
+ border-on-dark #2a2a2a
+ link #cc0000
+ ring #cc0000
bg-alt #f7f8fa
bg-deep #ffffff
surface-soft #f7f8fa
surface-elevated #ffffff
surface-dark #191b1f
surface-dark-soft #232529
text-soft #3b4248
text-link #ed1d24
text-disabled #a8b3bd
text-on-dark-soft #cdd2d8
text-on-dark-muted #9ba3ab
brand-pale #fcd1d3
robux-green #00b06f
robux-green-hover #008f59
robux-green-deep #006d44
free-badge-blue #00a2ff
premium-purple #b08aff
premium-purple-deep #7e5cd6
builders-club #ffd000
online-green #00b06f
voice-blue #00a2ff
link-default #ed1d24
link-visited #ed1d24
border-input #cdd2d8
scrim rgba(0,0,0,0.6)
shadow-card rgba(25,27,31,0.08)
shadow-elev rgba(25,27,31,0.16)
shadow-modal rgba(25,27,31,0.24)
experience-thumb-1 #0095da
experience-thumb-2 #ff8a00
experience-thumb-3 #9b30ff
rating-thumbs-up #00b06f
rating-thumbs-down #5c6770
typography 5 changed
~ display {"family":"Builder Sans","size":56} {"family":"HondaGlobalFontEN-Regular","size":72}
~ h1 {"family":"Builder Sans","size":40} {"family":"HondaGlobalFontEN-Regular","size":40}
~ h2 {"family":"Builder Sans","size":32} {"family":"HondaGlobalFontEN-Regular","size":32}
~ body {"family":"Builder Sans","size":14} {"family":"HondaGlobalFontEN-Regular","size":14}
~ label {"family":"Source Code Pro","size":11} {"family":"JetBrains Mono","size":11}
radius 2 changed
~ button 8px 6px
~ card 12px 8px
spacing identical
No differences.
↻ Swap direction · Honda → Roblox