Diff

Obsidian vs Temporal

44 token-level differences between these two design systems.

Role tokens
Background
#0f0f0f #141414
Text
#eeeeee #f8fafc
Brand
#7c3aed #444ce7
Border
#2a2a2a #2a2a2a
Display font
Inter Aeonik
Body size
16px 16px
colors 40 changed
~ bg #0f0f0f #141414
~ surface #161616 #1a1a1a
~ text #eeeeee #f8fafc
~ text-muted #a3a3a3 #94a3b8
~ brand #7c3aed #444ce7
~ border-soft #1f1f1f #222222
~ success #4ade80 #34d399
~ warning #fbbf24 #fed553
~ danger #f87171 #f43f5e
~ info #a78bfa #444ce7
+ surface-elevated #222222
+ surface-code #243349
+ surface-pre #1f2937
+ text-body #cbd5e1
+ text-inverse #141414
+ brand-bright #5b63f0
+ link #444ce7
+ ring rgba(68,76,231,0.5)
+ shadow-color rgba(0,0,0,0.6)
+ code-text #f8fafc
+ code-keyword #fed553
bg-deep #0a0a0a
surface-elev #1f1f1f
surface-hover #262626
text-strong #ffffff
text-secondary #b0b0b0
text-faint #737373
brand-hover #6d28d9
brand-active #5b21b6
brand-text #a78bfa
brand-text-hover #c4b5fd
brand-soft #2a1a4a
border-brand #7c3aed
shadow-ambient rgba(0,0,0,0.40)
shadow-card rgba(0,0,0,0.50)
shadow-modal rgba(0,0,0,0.70)
scrim rgba(0,0,0,0.65)
success-soft #14321f
warning-soft #33270a
danger-soft #3a1717
typography 4 changed
~ display {"family":"Inter","size":60} {"family":"Aeonik","size":68}
~ h1 {"family":"Inter","size":40} {"family":"Aeonik","size":40}
~ h2 {"family":"Inter","size":32} {"family":"Aeonik","size":32}
~ body {"family":"Inter","size":16} {"family":"Aeonik","size":16}
radius identical
No differences.
spacing identical
No differences.
↻ Swap direction · Temporal → Obsidian