diff --git a/src/components/Card/index.js b/src/components/Card/index.js
index 6257f5622..e8cab2dc3 100644
--- a/src/components/Card/index.js
+++ b/src/components/Card/index.js
@@ -60,6 +60,11 @@ const cardDriverStyle = css`
   padding: ${theme.size.default} ${theme.size.medium};
   align-items: center;
 
+  // override "height" HTML attribute
+  img {
+    height: 100%;
+  }
+
   p {
     margin: 0 0 0 18px;
     font-weight: 400;
@@ -76,12 +81,7 @@ const landingBottomStyling = css`
   }
 `;
 
-const CardIcon = styled('img')`
-  width: ${theme.size.large};
-`;
-
-const CompactIcon = styled('img')`
-  width: ${theme.size.medium};
+const compactIconStyle = `
   @media ${theme.screenSize.upToSmall} {
     width: 20px;
   }
@@ -140,12 +140,19 @@ const Card = ({
   const template = page?.options?.template;
 
   const isLanding = template === 'landing';
-  const Icon = ['landing', 'product-landing'].includes(template) ? CardIcon : CompactIcon;
 
   /* If tag == 'landing-bottom', this is 2nd group of cards on 
   landing page which we want to keep exempt from landing styles */
   const isLandingBottom = tag === 'landing-bottom';
 
+  let imgSize;
+  if (isLanding && isLandingBottom) imgSize = '50px';
+  else if (isLanding) imgSize = theme.size.xlarge;
+  else if (template === 'product-landing') imgSize = theme.size.large;
+  else imgSize = theme.size.medium;
+
+  const useCompactIcon = !['landing', 'product-landing'].includes(template);
+
   const styling = [
     cardBaseStyles,
     isForDrivers ? cardDriverStyle : cardStyling,
@@ -156,7 +163,15 @@ const Card = ({
 
   return (
     <LeafyGreenCard className={cx(styling)} onClick={url ? () => onCardClick(url) : undefined}>
-      {icon && <Icon src={withPrefix(icon)} alt={iconAlt} />}
+      {icon && (
+        <img
+          src={withPrefix(icon)}
+          alt={iconAlt}
+          width={imgSize}
+          height={imgSize}
+          className={useCompactIcon ? cx(compactIconStyle) : ''}
+        />
+      )}
       <ConditionalWrapper
         condition={isCompact || isExtraCompact}
         wrapper={(children) => <CompactTextWrapper>{children}</CompactTextWrapper>}
diff --git a/src/components/Permalink.js b/src/components/Permalink.js
index 56a957b01..083b5822c 100644
--- a/src/components/Permalink.js
+++ b/src/components/Permalink.js
@@ -64,7 +64,7 @@ const Permalink = ({ id, description, buffer }) => {
         title={'Permalink to this ' + description}
         onClick={handleClick}
       >
-        <LinkIcon src={withPrefix('assets/link.svg')} />
+        <LinkIcon src={withPrefix('assets/link.svg')} width={10} height={10} />
         <Tooltip
           className={cx(tooltipStyle)}
           triggerEvent="click"
diff --git a/src/templates/NotFound.js b/src/templates/NotFound.js
index 608eda692..ce29321d8 100644
--- a/src/templates/NotFound.js
+++ b/src/templates/NotFound.js
@@ -37,15 +37,7 @@ const NotFoundImage = () => {
   const altText = 'Page not found';
   const imgPath = 'assets/404.png';
 
-  return (
-    <img
-      src={withPrefix(imgPath)}
-      alt={altText}
-      css={css`
-        width: 444px;
-      `}
-    />
-  );
+  return <img src={withPrefix(imgPath)} alt={altText} height={444} width={444} />;
 };
 
 const ErrorBoxContainer = () => {
diff --git a/tests/unit/__snapshots__/Card.test.js.snap b/tests/unit/__snapshots__/Card.test.js.snap
index d256bbebe..eced4dbf6 100644
--- a/tests/unit/__snapshots__/Card.test.js.snap
+++ b/tests/unit/__snapshots__/Card.test.js.snap
@@ -49,17 +49,7 @@ exports[`renders correctly 1`] = `
   margin-bottom: 0;
 }
 
-.emotion-1 {
-  width: 24px;
-}
-
-@media only screen and (max-width: 480px) {
-  .emotion-1 {
-    width: 20px;
-  }
-}
-
-.emotion-4 {
+.emotion-2 {
   -webkit-align-items: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -76,7 +66,7 @@ exports[`renders correctly 1`] = `
   margin-right: auto;
 }
 
-.emotion-5 {
+.emotion-3 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -89,12 +79,12 @@ exports[`renders correctly 1`] = `
   margin: 16px 0 8px 0;
 }
 
-.emotion-5 strong,
-.emotion-5 b {
+.emotion-3 strong,
+.emotion-3 b {
   font-weight: 700;
 }
 
-.emotion-6 {
+.emotion-4 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -105,12 +95,12 @@ exports[`renders correctly 1`] = `
   margin-bottom: 16px;
 }
 
-.emotion-6 strong,
-.emotion-6 b {
+.emotion-4 strong,
+.emotion-4 b {
   font-weight: 700;
 }
 
-.emotion-7 {
+.emotion-5 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -120,16 +110,16 @@ exports[`renders correctly 1`] = `
   font-weight: 400;
 }
 
-.emotion-7 strong,
-.emotion-7 b {
+.emotion-5 strong,
+.emotion-5 b {
   font-weight: 700;
 }
 
-.emotion-7 a {
+.emotion-5 a {
   line-height: unset;
 }
 
-.emotion-8 {
+.emotion-6 {
   font-size: 13px;
   line-height: 20px;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
@@ -151,22 +141,22 @@ exports[`renders correctly 1`] = `
   text-decoration: none!important;
 }
 
-.emotion-8:hover,
-.emotion-8:focus,
-.emotion-8:visited {
+.emotion-6:hover,
+.emotion-6:focus,
+.emotion-6:visited {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-8:focus {
+.emotion-6:focus {
   outline: none;
 }
 
-.emotion-9 {
+.emotion-7 {
   position: relative;
 }
 
-.emotion-9::after {
+.emotion-7::after {
   content: '';
   position: absolute;
   width: 100%;
@@ -176,11 +166,11 @@ exports[`renders correctly 1`] = `
   border-radius: 2px;
 }
 
-.lg-ui-0001:focus .emotion-9::after {
+.lg-ui-0001:focus .emotion-7::after {
   background-color: #0498EC;
 }
 
-.lg-ui-0001:hover .emotion-9::after {
+.lg-ui-0001:hover .emotion-7::after {
   background-color: #E8EDEB;
 }
 
@@ -189,35 +179,41 @@ exports[`renders correctly 1`] = `
   >
     <img
       alt="MongoDB University icon"
-      class="emotion-1 emotion-2"
+      class="
+  @media only screen and (max-width: 480px) {
+    width: 20px;
+  }
+"
+      height="24px"
       src="/images/icons/university.svg"
+      width="24px"
     />
     <span
-      class="emotion-3 emotion-4"
+      class="emotion-1 emotion-2"
     >
       Test card tag
     </span>
     <div>
       <p
-        class="emotion-5"
+        class="emotion-3"
       >
         Test card headline
       </p>
       <p
-        class="emotion-6"
+        class="emotion-4"
       >
         Test card paragraph
       </p>
       <p
-        class="emotion-7"
+        class="emotion-5"
       >
         <a
-          class="lg-ui-0001 emotion-8"
+          class="lg-ui-0001 emotion-6"
           href="https://university.mongodb.com/courses/M001/about"
           target="_self"
         >
           <span
-            class="emotion-9"
+            class="emotion-7"
           >
             Test card CTA
           </span>
diff --git a/tests/unit/__snapshots__/CardGroup.test.js.snap b/tests/unit/__snapshots__/CardGroup.test.js.snap
index 564b8e672..3d701a1ae 100644
--- a/tests/unit/__snapshots__/CardGroup.test.js.snap
+++ b/tests/unit/__snapshots__/CardGroup.test.js.snap
@@ -106,16 +106,6 @@ exports[`renders correctly 1`] = `
 }
 
 .emotion-3 {
-  width: 24px;
-}
-
-@media only screen and (max-width: 480px) {
-  .emotion-3 {
-    width: 20px;
-  }
-}
-
-.emotion-5 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -128,16 +118,16 @@ exports[`renders correctly 1`] = `
 }
 
 @media only screen and (max-width: 480px) {
-  .emotion-5 {
+  .emotion-3 {
     margin-left: 16px;
   }
 }
 
-.emotion-5 p {
+.emotion-3 p {
   line-height: 24px;
 }
 
-.emotion-7 {
+.emotion-5 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -148,12 +138,12 @@ exports[`renders correctly 1`] = `
   margin-bottom: 16px;
 }
 
-.emotion-7 strong,
-.emotion-7 b {
+.emotion-5 strong,
+.emotion-5 b {
   font-weight: 700;
 }
 
-.emotion-8 {
+.emotion-6 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -163,16 +153,16 @@ exports[`renders correctly 1`] = `
   font-weight: 400;
 }
 
-.emotion-8 strong,
-.emotion-8 b {
+.emotion-6 strong,
+.emotion-6 b {
   font-weight: 700;
 }
 
-.emotion-8 a {
+.emotion-6 a {
   line-height: unset;
 }
 
-.emotion-9 {
+.emotion-7 {
   font-size: 13px;
   line-height: 20px;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
@@ -194,22 +184,22 @@ exports[`renders correctly 1`] = `
   text-decoration: none!important;
 }
 
-.emotion-9:hover,
-.emotion-9:focus,
-.emotion-9:visited {
+.emotion-7:hover,
+.emotion-7:focus,
+.emotion-7:visited {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-9:focus {
+.emotion-7:focus {
   outline: none;
 }
 
-.emotion-10 {
+.emotion-8 {
   position: relative;
 }
 
-.emotion-10::after {
+.emotion-8::after {
   content: '';
   position: absolute;
   width: 100%;
@@ -219,11 +209,11 @@ exports[`renders correctly 1`] = `
   border-radius: 2px;
 }
 
-.lg-ui-0001:focus .emotion-10::after {
+.lg-ui-0001:focus .emotion-8::after {
   background-color: #0498EC;
 }
 
-.lg-ui-0001:hover .emotion-10::after {
+.lg-ui-0001:hover .emotion-8::after {
   background-color: #E8EDEB;
 }
 
@@ -235,28 +225,34 @@ exports[`renders correctly 1`] = `
     >
       <img
         alt="MongoDB Atlas icon"
-        class="emotion-3 emotion-4"
+        class="
+  @media only screen and (max-width: 480px) {
+    width: 20px;
+  }
+"
+        height="24px"
         src="/images/icons/atlas.svg"
+        width="24px"
       />
       <div
-        class="emotion-5 emotion-6"
+        class="emotion-3 emotion-4"
       >
         <div>
           <p
-            class="emotion-7"
+            class="emotion-5"
           >
             Use Compass to connect to your Atlas cluster
           </p>
           <p
-            class="emotion-8"
+            class="emotion-6"
           >
             <a
-              class="lg-ui-0001 emotion-9"
+              class="lg-ui-0001 emotion-7"
               href="https://www.mongodb.com/docs/atlas/getting-started/"
               target="_self"
             >
               <span
-                class="emotion-10"
+                class="emotion-8"
               >
                 Read Atlas docs
               </span>
@@ -270,28 +266,34 @@ exports[`renders correctly 1`] = `
     >
       <img
         alt="MongoDB University icon"
-        class="emotion-3 emotion-4"
+        class="
+  @media only screen and (max-width: 480px) {
+    width: 20px;
+  }
+"
+        height="24px"
         src="/images/icons/university.svg"
+        width="24px"
       />
       <div
-        class="emotion-5 emotion-6"
+        class="emotion-3 emotion-4"
       >
         <div>
           <p
-            class="emotion-7"
+            class="emotion-5"
           >
             Learn MongoDB Basics with MongoDB University
           </p>
           <p
-            class="emotion-8"
+            class="emotion-6"
           >
             <a
-              class="lg-ui-0001 emotion-9"
+              class="lg-ui-0001 emotion-7"
               href="https://university.mongodb.com/courses/M001/about"
               target="_self"
             >
               <span
-                class="emotion-10"
+                class="emotion-8"
               >
                 Learn MongoDB Basics
               </span>
@@ -305,28 +307,34 @@ exports[`renders correctly 1`] = `
     >
       <img
         alt="MongoDB Server icon"
-        class="emotion-3 emotion-4"
+        class="
+  @media only screen and (max-width: 480px) {
+    width: 20px;
+  }
+"
+        height="24px"
         src="/images/icons/server.svg"
+        width="24px"
       />
       <div
-        class="emotion-5 emotion-6"
+        class="emotion-3 emotion-4"
       >
         <div>
           <p
-            class="emotion-7"
+            class="emotion-5"
           >
             Access more in-depth examples of querying data
           </p>
           <p
-            class="emotion-8"
+            class="emotion-6"
           >
             <a
-              class="lg-ui-0001 emotion-9"
+              class="lg-ui-0001 emotion-7"
               href="https://www.mongodb.com/docs/manual/tutorial/getting-started/"
               target="_self"
             >
               <span
-                class="emotion-10"
+                class="emotion-8"
               >
                 Read Server docs
               </span>
diff --git a/tests/unit/__snapshots__/CardRef.test.js.snap b/tests/unit/__snapshots__/CardRef.test.js.snap
index 39f4cf783..cffb1af70 100644
--- a/tests/unit/__snapshots__/CardRef.test.js.snap
+++ b/tests/unit/__snapshots__/CardRef.test.js.snap
@@ -87,16 +87,6 @@ exports[`card correctly with and without url 1`] = `
 }
 
 .emotion-3 {
-  width: 24px;
-}
-
-@media only screen and (max-width: 480px) {
-  .emotion-3 {
-    width: 20px;
-  }
-}
-
-.emotion-5 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -109,16 +99,16 @@ exports[`card correctly with and without url 1`] = `
 }
 
 @media only screen and (max-width: 480px) {
-  .emotion-5 {
+  .emotion-3 {
     margin-left: 16px;
   }
 }
 
-.emotion-5 p {
+.emotion-3 p {
   line-height: 24px;
 }
 
-.emotion-7 {
+.emotion-5 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -131,12 +121,12 @@ exports[`card correctly with and without url 1`] = `
   margin: 0 0 8px;
 }
 
-.emotion-7 strong,
-.emotion-7 b {
+.emotion-5 strong,
+.emotion-5 b {
   font-weight: 700;
 }
 
-.emotion-8 {
+.emotion-6 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -147,12 +137,12 @@ exports[`card correctly with and without url 1`] = `
   margin-bottom: 16px;
 }
 
-.emotion-8 strong,
-.emotion-8 b {
+.emotion-6 strong,
+.emotion-6 b {
   font-weight: 700;
 }
 
-.emotion-10 {
+.emotion-8 {
   -webkit-align-items: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -166,15 +156,15 @@ exports[`card correctly with and without url 1`] = `
   color: #016BF8;
 }
 
-.emotion-10:focus {
+.emotion-8:focus {
   outline: none;
 }
 
-.emotion-10>code {
+.emotion-8>code {
   color: #016BF8;
 }
 
-.emotion-10::after {
+.emotion-8::after {
   content: '';
   position: absolute;
   width: 100%;
@@ -184,15 +174,15 @@ exports[`card correctly with and without url 1`] = `
   border-radius: 2px;
 }
 
-.emotion-10:focus .emotion-10::after {
+.emotion-8:focus .emotion-8::after {
   background-color: #0498EC;
 }
 
-.emotion-10:hover::after {
+.emotion-8:hover::after {
   background-color: #E8EDEB;
 }
 
-.emotion-11 {
+.emotion-9 {
   background: #F9FBFA;
   border-radius: 4px;
   border: 1px solid #C1C7C6;
@@ -205,11 +195,11 @@ exports[`card correctly with and without url 1`] = `
   padding: 4px;
 }
 
-.emotion-11:after {
+.emotion-9:after {
   content: ' ➔';
 }
 
-.emotion-22 {
+.emotion-20 {
   position: relative;
   -webkit-transition: 150ms ease-in-out;
   transition: 150ms ease-in-out;
@@ -244,27 +234,27 @@ exports[`card correctly with and without url 1`] = `
   padding: 32px 24px;
 }
 
-.emotion-22:focus {
+.emotion-20:focus {
   outline: none;
   box-shadow: 0 0 0 2px #FFFFFF,0 0 0 4px #0498EC,0 4px 10px -4px rgba(0,30,43,0.3);
 }
 
-.emotion-22:hover,
-.emotion-22:active {
+.emotion-20:hover,
+.emotion-20:active {
   border: 1px solid #E8EDEB;
   box-shadow: 0 4px 20px -4px rgba(0,30,43,0.2);
 }
 
-.emotion-22:hover:focus,
-.emotion-22:active:focus {
+.emotion-20:hover:focus,
+.emotion-20:active:focus {
   box-shadow: 0 0 0 2px #FFFFFF,0 0 0 4px #0498EC,0 4px 20px -4px rgba(0,30,43,0.2);
 }
 
-.emotion-22 p:last-of-type {
+.emotion-20 p:last-of-type {
   margin-bottom: 0;
 }
 
-.emotion-29 {
+.emotion-25 {
   margin: unset;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
   color: #001E2B;
@@ -274,16 +264,16 @@ exports[`card correctly with and without url 1`] = `
   font-weight: 400;
 }
 
-.emotion-29 strong,
-.emotion-29 b {
+.emotion-25 strong,
+.emotion-25 b {
   font-weight: 700;
 }
 
-.emotion-29 a {
+.emotion-25 a {
   line-height: unset;
 }
 
-.emotion-30 {
+.emotion-26 {
   font-size: 13px;
   line-height: 20px;
   font-family: 'Euclid Circular A','Helvetica Neue',Helvetica,Arial,sans-serif;
@@ -305,22 +295,22 @@ exports[`card correctly with and without url 1`] = `
   text-decoration: none!important;
 }
 
-.emotion-30:hover,
-.emotion-30:focus,
-.emotion-30:visited {
+.emotion-26:hover,
+.emotion-26:focus,
+.emotion-26:visited {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-30:focus {
+.emotion-26:focus {
   outline: none;
 }
 
-.emotion-31 {
+.emotion-27 {
   position: relative;
 }
 
-.emotion-31::after {
+.emotion-27::after {
   content: '';
   position: absolute;
   width: 100%;
@@ -330,11 +320,11 @@ exports[`card correctly with and without url 1`] = `
   border-radius: 2px;
 }
 
-.lg-ui-0001:focus .emotion-31::after {
+.lg-ui-0001:focus .emotion-27::after {
   background-color: #0498EC;
 }
 
-.lg-ui-0001:hover .emotion-31::after {
+.lg-ui-0001:hover .emotion-27::after {
   background-color: #E8EDEB;
 }
 
@@ -345,28 +335,34 @@ exports[`card correctly with and without url 1`] = `
       class="emotion-2"
     >
       <img
-        class="emotion-3 emotion-4"
+        class="
+  @media only screen and (max-width: 480px) {
+    width: 20px;
+  }
+"
+        height="24px"
         src="/images/icons/realm_sdk.svg"
+        width="24px"
       />
       <div
-        class="emotion-5 emotion-6"
+        class="emotion-3 emotion-4"
       >
         <div>
           <p
-            class="emotion-7"
+            class="emotion-5"
           >
             Realm SDKs
           </p>
           <p
-            class="emotion-8"
+            class="emotion-6"
           >
             Use platform-specific libraries to include and work with the Realm database in your application.
           </p>
           <p
-            class="emotion-8"
+            class="emotion-6"
           >
             <a
-              class="emotion-10 emotion-11"
+              class="emotion-8 emotion-9"
               href="/sdk/android/#std-label-android-intro"
             >
               Android
@@ -374,7 +370,7 @@ exports[`card correctly with and without url 1`] = `
             
 
             <a
-              class="emotion-10 emotion-11"
+              class="emotion-8 emotion-9"
               href="/sdk/ios/#std-label-ios-intro"
             >
               iOS
@@ -382,7 +378,7 @@ exports[`card correctly with and without url 1`] = `
             
 
             <a
-              class="emotion-10 emotion-11"
+              class="emotion-8 emotion-9"
               href="/sdk/dotnet/#std-label-dotnet-intro"
             >
               .Net
@@ -390,7 +386,7 @@ exports[`card correctly with and without url 1`] = `
             
 
             <a
-              class="emotion-10 emotion-11"
+              class="emotion-8 emotion-9"
               href="/web/#std-label-web-intro"
             >
               Web
@@ -398,7 +394,7 @@ exports[`card correctly with and without url 1`] = `
             
 
             <a
-              class="emotion-10 emotion-11"
+              class="emotion-8 emotion-9"
               href="/sdk/react-native/#std-label-react-native-intro"
             >
               React Native
@@ -406,7 +402,7 @@ exports[`card correctly with and without url 1`] = `
             
 
             <a
-              class="emotion-10 emotion-11"
+              class="emotion-8 emotion-9"
               href="/sdk/node/#std-label-node-intro"
             >
               Node.js
@@ -416,36 +412,42 @@ exports[`card correctly with and without url 1`] = `
       </div>
     </div>
     <div
-      class="emotion-22"
+      class="emotion-20"
     >
       <img
-        class="emotion-3 emotion-4"
+        class="
+  @media only screen and (max-width: 480px) {
+    width: 20px;
+  }
+"
+        height="24px"
         src="/images/icons/realm.svg"
+        width="24px"
       />
       <div
-        class="emotion-5 emotion-6"
+        class="emotion-3 emotion-4"
       >
         <div>
           <p
-            class="emotion-7"
+            class="emotion-5"
           >
             MongoDB Realm
           </p>
           <p
-            class="emotion-8"
+            class="emotion-6"
           >
             Discover how to sync data, define permissions, and connect to other services, including MongoDB Atlas.
           </p>
           <p
-            class="emotion-29"
+            class="emotion-25"
           >
             <a
-              class="lg-ui-0001 emotion-30"
+              class="lg-ui-0001 emotion-26"
               href="https://docs.mongodb.com/realm/services/"
               target="_self"
             >
               <span
-                class="emotion-31"
+                class="emotion-27"
               >
                 Learn more about MongoDB Realm Application Services
               </span>
diff --git a/tests/unit/__snapshots__/Heading.test.js.snap b/tests/unit/__snapshots__/Heading.test.js.snap
index 58c17e9c0..97f4c1062 100644
--- a/tests/unit/__snapshots__/Heading.test.js.snap
+++ b/tests/unit/__snapshots__/Heading.test.js.snap
@@ -46,7 +46,9 @@ exports[`renders correctly 1`] = `
     >
       <img
         class="emotion-2 emotion-3"
+        height="10"
         src="/assets/link.svg"
+        width="10"
       />
     </a>
     <div
diff --git a/tests/unit/__snapshots__/Procedure.test.js.snap b/tests/unit/__snapshots__/Procedure.test.js.snap
index 30260056a..509211200 100644
--- a/tests/unit/__snapshots__/Procedure.test.js.snap
+++ b/tests/unit/__snapshots__/Procedure.test.js.snap
@@ -377,7 +377,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
@@ -421,7 +423,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
@@ -465,7 +469,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
@@ -509,7 +515,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
@@ -553,7 +561,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
@@ -597,7 +607,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
@@ -641,7 +653,9 @@ exports[`renders steps nested in include nodes 1`] = `
             >
               <img
                 class="emotion-11 emotion-12"
+                height="10"
                 src="/assets/link.svg"
+                width="10"
               />
             </a>
             <div
diff --git a/tests/unit/__snapshots__/Section.test.js.snap b/tests/unit/__snapshots__/Section.test.js.snap
index b6adddca9..1a1c62a55 100644
--- a/tests/unit/__snapshots__/Section.test.js.snap
+++ b/tests/unit/__snapshots__/Section.test.js.snap
@@ -50,7 +50,9 @@ exports[`renders correctly 1`] = `
       >
         <img
           class="emotion-2 emotion-3"
+          height="10"
           src="/assets/link.svg"
+          width="10"
         />
       </a>
       <div
diff --git a/tests/unit/__snapshots__/Target.test.js.snap b/tests/unit/__snapshots__/Target.test.js.snap
index fc9be52b2..07507f505 100644
--- a/tests/unit/__snapshots__/Target.test.js.snap
+++ b/tests/unit/__snapshots__/Target.test.js.snap
@@ -130,7 +130,9 @@ a .emotion-0 {
       >
         <img
           class="emotion-2 emotion-3"
+          height="10"
           src="/assets/link.svg"
+          width="10"
         />
       </a>
       <div