Design token diff
Showing changes between two snapshots of framer.com
+72 added−74 removedpw@1.58.2
Colors
+29 added−30 removed20 unchangedTypography
+13 added−14 removed10 unchanged+"Input Mono Regular", "Input Mono Regular Placeholder", monospace|12px|400Input Mono Regular 12px / 400
+"Input Mono Regular"|12px|400Input Mono Regular 12px / 400
+"Input Mono Bold"|12px|700Input Mono Bold 12px / 700
+"GT Walsheim Medium", "GT Walsheim Medium Placeholder", sans-serif|54px|500GT Walsheim Medium 54px / 500
+"GT Walsheim Medium", "GT Walsheim Medium Placeholder", sans-serif|44px|500GT Walsheim Medium 44px / 500
+Inter, "Inter Placeholder", sans-serif|9px|700Inter 9px / 700
Spacing
+11 added−11 removed21 unchanged+.15emSpace .15em
+.3emSpace .3em
+0.5px0.5px
+2.2pxSpace 2.2px
+3.3pxSpace 3.3px
+9.47pxSpace 9.47px
+13pxSpace 13px
+
Border Radius
+8 added−8 removed8 unchanged+25pxRadius 25px
+calc(15px*1)Radius calc 15px 1
+calc(20px*1)Radius calc 20px 1
+calc(19px*1)Radius calc 19px 1
+50pxRadius 50px
+1pxRadius 1px
+3pxRadius 3px
Shadows
+11 added−11 removed1 unchanged+0 10px 20px #0000000dShadow 2
+0 1px 2px #0000001aShadow 3
+0 2px 4px #00000040Shadow 4
+0 2px 6px #0003Shadow 5
+rgb(17, 17, 17) 0px 0px 0px 1.5pxshadow-div.framer-12hl57f
+rgba(255, 255, 255, 0.35) 0px 1px 1px 0px inset, rgba(255, 255, 255, 0.35) 0px -1px 1px 0px insetshadow-div.framer-u9k64n
+rgba(0, 0, 0, 0.1) 0px 1px 2px 0px
+
"Inter Medium", "Inter Medium Placeholder", sans-serif|12px|500
Inter Medium 12px / 500
+"Input Mono Bold", "Input Mono Bold Placeholder", monospace|12px|700Input Mono Bold 12px / 700
+"JetBrains Mono", "JetBrains Mono Placeholder", sans-serif|13px|400JetBrains Mono 13px / 400
+"Azeret Mono", "Azeret Mono Placeholder", sans-serif|9.6px|400Azeret Mono 9.6px / 400
+"Inter Variable", "Inter Variable Placeholder", sans-serif|10px|400Inter Variable 10px / 400
+"Inter Variable", "Inter Variable Placeholder", sans-serif|16px|400Inter Variable 16px / 400
+"GT Walsheim Medium"|54px|500GT Walsheim Medium 54px / 500
−"Inter Variable", "Inter Variable Placeholder", sans-serif|24px|400Inter Variable 24px / 400
−Inter, "Inter Placeholder", sans-serif|13px|600Inter 13px / 600
−"Mona Sans", "Mona Sans Placeholder", sans-serif|12px|500Mona Sans 12px / 500
−"mona sans"|61.5px|100mona sans 61.5px / 100
−"GT Walsheim Medium", "GT Walsheim Medium Placeholder", sans-serif|62px|500GT Walsheim Medium 62px / 500
−Inter, "Inter Placeholder", sans-serif|20px|600Inter 20px / 600
−"Open Runde", "Open Runde Placeholder", sans-serif|9px|600Open Runde 9px / 600
−Inter, sans-serif|20px|500Inter 20px / 500
−"GT Walsheim Framer Medium", "GT Walsheim Framer Medium Placeholder", sans-serif|110px|500GT Walsheim Framer Medium 110px / 500
−"Mona Sans", "Mona Sans Placeholder", sans-serif|18px|500Mona Sans 18px / 500
−"Mona Sans", "Mona Sans Placeholder", sans-serif|13px|500Mona Sans 13px / 500
−"Mona Sans", "Mona Sans Placeholder", sans-serif|17px|500Mona Sans 17px / 500
−Inter, "Inter Placeholder", sans-serif|22px|700Inter 22px / 700
−Inter, "Inter Placeholder", sans-serif|14px|500Inter 14px / 500
13.5px
13.5px
+
14px
Radius 14px
−calc(30px*1)Radius calc 30px 1
−calc(12px*1)Radius calc 12px 1
shadow-div.framer-3qh2ek
+rgba(255, 255, 255, 0.1) 0px 0px 0px 1pxshadow-div.framer-1s5lrpg
+rgba(255, 255, 255, 0.08) 0px 0px 0px 1pxshadow-div.framer-1lb04k7
+rgb(17, 17, 17) 0px 0px 0px 2pxshadow-div.framer-iv71y8
+rgba(0, 153, 255, 0.15) 0px 1px 2px 0px, rgba(0, 153, 255, 0.2) 0px 2px 4px 0pxshadow-div.framer-1r6tam5
−0 0 0 2px #090909Shadow 1
−0 10px 10px #0000004dShadow 2
−inset 0 0 0 2px #ffffff05Shadow 3
−0 3px 6px #0000004d,0 0 0 1px #ffffff0fShadow 4
−-10px 10px 20px 10px #0009Shadow 7
−0 2px 4px #0000001a,0 1px #0000000d,0 0 0 1px #ffffff26Shadow 8
−0 2px 4px #0000000d,0 1px #00000005,0 0 0 1px #00000003Shadow 9
−0 2px 4px #0000001a,0 1px #0000000d,0 0 0 1px #00000005Shadow 10
−0 5px 10px #00000040Shadow 11
−0 0 0 1px #ffffff1aShadow 12