Toyota vs Chevrolet
34 token-level differences between these two design systems.
Background
#ffffff → #ffffff Text
#333333 → #333333 Brand
#eb0a1e → #cd9834 Border
#d8d8d8 → #d6d6d6 Display font
ToyotaType → Louis Body size
16px → 16px colors 30 changed
~
bg-soft #f5f5f5 → #f4f4f4 ~
bg-dark #252525 → #1a1a1a ~
bg-dark-elev #383838 → #262626 ~
bg-deep #101010 → #000000 ~
surface-soft #f5f5f5 → #f4f4f4 ~
text-strong #252525 → #1a1a1a ~
text-ink #252525 → #1a1a1a ~
text-muted #6e6e6e → #666666 ~
text-faint #9c9c9c → #999999 ~
brand #eb0a1e → #cd9834 ~
brand-deep #7a0510 → #003876 ~
brand-disabled #d0d0d0 → #cccccc ~
border #d8d8d8 → #d6d6d6 ~
border-strong #a8a8a8 → #a6a6a6 ~
border-soft #e8e8e8 → #e6e6e6 ~
border-on-dark rgba(255,255,255,0.18) → rgba(255,255,255,0.16) ~
link #0066b1 → #003876 ~
link-hover #004f8c → #002b5e ~
ring #eb0a1e → #003876 ~
danger #eb0a1e → #dc1f2c ~
info #0066b1 → #003876 +
bg-blue-deep #003876 +
brand-deep-hover #002b5e +
accent-red #dc1f2c +
accent-red-deep #a8161f +
accent-yellow #f4d35e −
brand-hover #c10a16 −
accent-blue-hybrid #0066b1 −
accent-blue-hover #004f8c −
accent-gr-orange #ff5a1f typography 4 changed
~
display {"family":"ToyotaType","size":72} → {"family":"Louis","size":72} ~
h1 {"family":"ToyotaType","size":40} → {"family":"Louis","size":40} ~
h2 {"family":"ToyotaType","size":32} → {"family":"Louis","size":32} ~
body {"family":"ToyotaType","size":16} → {"family":"Louis","size":16} radius identical
No differences.
spacing identical
No differences.