Design token diff
Showing changes between two snapshots of css-tricks.com
+36 added−39 removedpw@1.58.2
Colors
+4 added−6 removed40 unchangedTypography
+20 added−21 removed3 unchanged+SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace|var(--font-size-8)|400Sfmono-regular 2
+SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace|1rem|400Sfmono-regular 3
+dashicons|22px|400Dashicons 4
+dashicons|18px|400Dashicons 3
+Open Sans, Arial, Helvetica, sans-serif|.75em|700Open Sans
+Open Sans, Arial, Helvetica, sans-serif|16px|400Open Sans 2
+dashicons|31px|400
Spacing
+10 added−10 removed22 unchanged+.15remSpace .15rem
+3.84px3.84px
+4.8px4.8px
+9.6px9.6px
+15.36px15.36px
+16.32px16.32px
+19.2px19.2px
+
Border Radius
+2 added−2 removed14 unchanged+0 0 4px 4pxRadius 0 0 4px 4px
+12pxRadius 12px
−.5emRadius .5em
−.5remRadius .5rem
Dashicons 5
+FontAwesome|14px|400Fontawesome
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|19.2px|400Iowan Old Style 19.2px / 400
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|16.32px|400Iowan Old Style 16.32px / 400
+NewTitle, "NewTitle Fallback", sans-serif|42.24px|800NewTitle 42.24px / 800
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|28.8px|400Iowan Old Style 28.8px / 400
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|16.32px|700Iowan Old Style 16.32px / 700
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|19.2px|700Iowan Old Style 19.2px / 700
+NewTitle, "NewTitle Fallback", sans-serif|48.5952px|800NewTitle 48.5952px / 800
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|23.04px|400Iowan Old Style 23.04px / 400
+NewTitle, "NewTitle Fallback", sans-serif|32px|500NewTitle 32px / 500
+"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif|20.16px|400Iowan Old Style 20.16px / 400
+NewTitle, "NewTitle Fallback", sans-serif|65.28px|800NewTitle 65.28px / 800
+NewTitle, "NewTitle Fallback", sans-serif|28.8px|400NewTitle 28.8px / 400
−Blanco, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol|var(--font-size-body)|400Blanco
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|clamp(2rem,2rem + 1.2vw,3rem)|700Md Primer Bold
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|clamp(2.5rem,2.5rem + .2vw,4rem)|800Md Primer Bold 2
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|2rem|800Md Primer Bold 3
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|1.5rem|700Md Primer Bold 4
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|.5rem|700Md Primer Bold 5
−SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace|inherit|400Sfmono-regular 2
−SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace|.85rem|400Sfmono-regular 3
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|.8rem|500Md Primer Bold 6
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|.66rem|700Md Primer Bold 7
−Blanco, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol|.8rem|400Blanco 2
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|.75rem|400Md Primer Bold 8
−MD Primer Bold, Rubik, Lato, Lucida Grande, Lucida Sans Unicode, Tahoma, Sans-Serif|1.4rem|400Md Primer Bold 9
−Blanco, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"|16px|400Blanco 16px / 400
−SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace|16px|400SFMono-Regular 16px / 400
−Blanco, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"|16px|700Blanco 16px / 700
−"MD Primer Bold", Rubik, Lato, "Lucida Grande", "Lucida Sans Unicode", Tahoma, sans-serif|20.8px|800MD Primer Bold 20.8px / 800
−"MD Primer Bold", Rubik, Lato, "Lucida Grande", "Lucida Sans Unicode", Tahoma, sans-serif|10.56px|700MD Primer Bold 10.56px / 700
−Blanco, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"|16.8px|400Blanco 16.8px / 400
−"MD Primer Bold", Rubik, Lato, "Lucida Grande", "Lucida Sans Unicode", Tahoma, sans-serif|12.8px|500MD Primer Bold 12.8px / 500
−"MD Primer Bold", Rubik, Lato, "Lucida Grande", "Lucida Sans Unicode", Tahoma, sans-serif|42.56px|800MD Primer Bold 42.56px / 800
28.8px
28.8px