Diff

Snowflake vs Brilliant

67 token-level differences between these two design systems.

Role tokens
Background
#ffffff #0c0e16
Text
#000000 #ffffff
Brand
#249EDC #fc6e51
Border
#D8DFE5 rgba(255, 255, 255, 0.08)
Display font
Texta Brilliant Sans
Body size
16px 16px
colors 60 changed
~ bg #ffffff #0c0e16
~ bg-deep #0F2A3A #06070d
~ surface #f5fafd #13151f
~ text #000000 #ffffff
~ text-muted #9A9A9A #a8acba
~ brand #249EDC #fc6e51
~ brand-deep #1A82B8 #b8401f
~ link #1A82B8 #fc6e51
~ link-hover #0F2A3A #ffffff
~ border #D8DFE5 rgba(255, 255, 255, 0.08)
~ border-strong #B0BBC4 rgba(255, 255, 255, 0.16)
+ bg-section #13151f
+ bg-elev #1c1f2c
+ surface-strong #1f2230
+ brand-hover #ff8268
+ brand-pressed #e25738
+ brand-tint rgba(252, 110, 81, 0.15)
+ text-strong #ffffff
+ text-soft #7a7e8c
+ text-faint #5a5e6c
+ text-on-brand #ffffff
+ selected-bg rgba(252, 110, 81, 0.15)
+ border-brand #fc6e51
+ diagram-coral #fc6e51
+ diagram-yellow #ffd44d
+ diagram-cyan #5ac3e5
+ diagram-purple #b582ff
+ success #5ac38a
+ warning #ffd44d
+ danger #ff5a6d
+ info #5ac3e5
bg-surface #f5fafd
bg-soft #eaf4fb
bg-feature #dfeff9
bg-midnight #091C28
bg-ink #000000
text-charcoal #111111
text-slate #2A2A2A
text-steel #444444
text-stone #6B6B6B
text-on-deep #ffffff
text-on-deep-muted #B6D2E2
brand-light #45AEE3
brand-bright #3DB5E8
brand-dark #0F2A3A
brand-soft #C6E6F6
brand-wash #DFEFF9
brand-mid #6AC4EA
on-brand-deep #ffffff
accent-coral #FF7A59
accent-violet #7B61FF
accent-emerald #16A672
accent-amber #F5B400
border-soft #E8EDF1
border-on-deep #1B3F55
semantic-success #16A672
semantic-warning-bg #FFF6E0
semantic-warning-text #8A6A1A
semantic-error #D8333C
semantic-info #1A82B8
typography 5 changed
~ display {"family":"Texta","size":72} {"family":"Brilliant Sans","size":88}
~ h1 {"family":"Texta","size":40} {"family":"Brilliant Sans","size":40}
~ h2 {"family":"Texta","size":32} {"family":"Brilliant Sans","size":32}
~ body {"family":"Texta","size":16} {"family":"Brilliant Sans","size":16}
~ label {"family":"JetBrains Mono","size":11} {"family":"JetBrains Mono","size":13}
radius 2 changed
~ button 12px 8px
~ card 16px 12px
spacing identical
No differences.
↻ Swap direction · Brilliant → Snowflake