Diff

Cognition vs xAI

59 token-level differences between these two design systems.

Role tokens
Background
#f7f6f5 #ffffff
Text
#000000 #0a0a0a
Brand
#191919 #0a0a0a
Border
#000000 #d5d9e2
Display font
nbInternational Universal Sans Display
Body size
16px 16px
colors 52 changed
~ bg #f7f6f5 #ffffff
~ surface #ffffff #f9f8f6
~ text #000000 #0a0a0a
~ text-muted #9a9a9a #6b7280
~ brand #191919 #0a0a0a
~ brand-hover #000000 #1f1f1f
~ on-brand #f7f6f5 #0a0a0a
~ link #000000 #111827
~ link-hover #191919 #0a0a0a
~ border #000000 #d5d9e2
~ border-soft rgba(0, 0, 0, 0.12) rgba(10,10,10,0.08)
+ bg-soft #fafafa
+ surface-terminal #f8f7f5
+ surface-card #fffffff2
+ surface-hover rgba(10,10,10,0.04)
+ surface-press rgba(10,10,10,0.08)
+ header-bg rgba(255,255,255,0.85)
+ text-strong #0a0a0a
+ text-terminal #262626
+ text-subtle #8a8f98
+ text-on-brand #ffffff
+ brand-active #2c2c2c
+ link-visited #111827
+ ring #3b82f6
+ border-strong rgba(10,10,10,0.16)
+ scrim rgba(10,10,10,0.5)
+ shadow-color rgba(0,0,0,0.10)
+ terminal-fg #262626
+ terminal-green #248430
+ terminal-green-bg #e3efe4
+ terminal-red #be2e31
+ terminal-red-bg #f8eaea
+ success #248430
+ success-bg #ecfdf3
+ info #3b82f6
+ info-bg #f0f8ff
+ warning #b45309
+ warning-bg #fffcf0
+ danger #be2e31
+ danger-bg #fff0f0
bg-secondary #f0efed
text-soft #3d3d3d
text-faint #6b6b6b
selected-bg #0000000d
disabled #9a9a9a
border-subtle rgba(0, 0, 0, 0.06)
input-bg rgba(0, 0, 0, 0.031)
input-bg-hover rgba(0, 0, 0, 0.051)
success-text #1f5130
warning-text #7a5e1f
danger-text #8a2b2b
info-text #26416b
typography 4 changed
~ display {"family":"nbInternational","size":72} {"family":"Universal Sans Display","size":80}
~ h1 {"family":"nbInternational","size":36} {"family":"Universal Sans Display","size":60}
~ h2 {"family":"nbInternational","size":20} {"family":"Universal Sans Display","size":48}
~ body {"family":"stkBureauSerif","size":16} {"family":"Universal Sans","size":16}
radius 3 changed
~ button 0px 8px
~ card 0px 12px
~ pill 0px 9999px
spacing identical
No differences.
↻ Swap direction · xAI → Cognition