Design token diff
Showing changes between two snapshots of raycast.com
+44 added−33 removedpw@1.58.2
Colors
+19 added−8 removed28 unchangedTypography
+4 added−4 removed20 unchanged+"SF Pro"|13px|700SF Pro 13px / 700
+Inter, "Inter Fallback", sans-serif|14px|400Inter 14px / 400
+Inter, "Inter Fallback", sans-serif|11.9px|400Inter 11.9px / 400
+Inter, "Inter Fallback", sans-serif|15px|400Inter 15px / 400
−SF Pro|13px|700Sf Pro
−Inter, "Inter Fallback", sans-serif|24px|500Inter 24px / 500
−GeistMono, ui-monospace, SFMono-Regular, "Roboto Mono", Menlo, Monaco, "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace|14px|500
Spacing
+2 added−2 removed30 unchanged+.75remSpace .75rem
+-14px-14px
−.25emSpace .25em
−48px48px
Border Radius
+7 added−7 removed9 unchanged+inheritRadius inherit
+10pxRadius 10px
+100000000pxRadius 100000000px
+9999999pxRadius 9999999px
+99999pxRadius 99999px
+300pxRadius 300px
+5pxRadius 5px
Shadows
+12 added−12 removed+inset 0 1px #ffffff0dShadow 1
+inset 0 0 #ffffff0dShadow 2
+inset 0 1px 1px #ffffff26Shadow 3
+0 0 28.129px 9.37634px #00000080Shadow 4
+0 4px 4px #00000040Shadow 5
+0 0 40px 20px #ffffff08,inset 0 .5px #ffffff4dShadow 6
+0 0 2px #ffffff30,inset 0 .5px #ffffff1aShadow 7
+
GeistMono 14px / 500
−Inter, "Inter Fallback", sans-serif|22px|400Inter 22px / 400
−
86px
Radius 86px
−12px 0 0 12pxRadius 12px 0 0 12px
−0 12px 12px 0Radius 0 12px 12px 0
inset 0 .5px #ffffff4d,0 0 0 .5px #000c,0 4px 40px 8px #0006
Shadow 8
+inset 0 8.716px 8.716px #0000001aShadow 9
+0 10px 20px #0000000dShadow 10
+0 1px 4px #0006,0 0 20px #00000054,inset 0 1px #ffffff14,inset 0 0 0 1px #ffffff0dShadow 11
+0 4px 40px 15px #08090be6,0 0 100px 20px #ff493940,0 1px 4px #0006,0 0 20px #0000002b,inset 0 0 15px 2px #ff493940,inset 0 .5px #ffccc785,inset 0 0 0 1px #ff493924Shadow 12
−inset 0 1px 0 0 rgba(255,255,255,.05)Shadow 1
−inset 0 0 0 0 rgba(255,255,255,.05)Shadow 2
−inset 0 0 0 1px rgb(255 255 255/10%)Shadow 3
−0 0 0 2px rgba(0,0,0,.5),0 0 14px 0 rgba(255,255,255,.19),inset 0 -1px .4px 0 rgba(0,0,0,.2),inset 0 1px .4px 0 #fffShadow 4
−inset 0 -1px .4px 0 rgba(0,0,0,.2),inset 0 1px .4px 0 #fff,0 0 0 2px rgba(0,0,0,.5),0 0 14px 0 rgba(255,255,255,.19)Shadow 5
−inset 0 -1px .4px 0 rgba(0,0,0,.2),inset 0 1px .4px 0 #fff,0 0 0 2px #f4f4f4,0 0 0 2px rgba(0,0,0,.5),0 0 14px 0 rgba(255,255,255,.19)Shadow 6
−0 0 0 2px rgba(0,0,0,.5)Shadow 7
−inset 0 1px 0 0 rgba(255,255,255,.05),0 0 0 1px rgba(255,255,255,.25),inset 0 -1px 0 0 rgba(0,0,0,.2)Shadow 8
−inset 0 1px 0 0 rgba(255,255,255,.05),0 0 0 1px rgba(255,255,255,.5),inset 0 -1px 0 0 rgba(0,0,0,.2)Shadow 9
−inset 0 1px 0 0 rgba(255,255,255,.05),0 0 0 1px rgba(255,255,255,.15),inset 0 -1px 0 0 rgba(0,0,0,.2)Shadow 10
−inset 0 1px 0 0 rgba(255,255,255,.05),0 0 0 2px rgba(255,255,255,.5),inset 0 -1px 0 0 rgba(0,0,0,.2)Shadow 11
−0 0 0 1px rgba(255,255,255,.25),inset 0 -1px 0 0 rgba(0,0,0,.2)Shadow 12