diff --git a/packages/dnb-design-system-portal/src/html.js b/packages/dnb-design-system-portal/src/html.js
index 43b15800d34..6fc0aa50047 100644
--- a/packages/dnb-design-system-portal/src/html.js
+++ b/packages/dnb-design-system-portal/src/html.js
@@ -16,7 +16,7 @@ export default class HTML extends PureComponent {
           <meta name="robots" content="noindex" />
           <meta
             name="viewport"
-            content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=yes, maximum-scale=12"
+            content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=yes"
           />
           {this.props.headComponents}
         </head>
diff --git a/packages/dnb-design-system-portal/src/pages/quickguide-designer/colors.md b/packages/dnb-design-system-portal/src/pages/quickguide-designer/colors.md
index 32dd603031b..7eae0b19342 100644
--- a/packages/dnb-design-system-portal/src/pages/quickguide-designer/colors.md
+++ b/packages/dnb-design-system-portal/src/pages/quickguide-designer/colors.md
@@ -4,7 +4,6 @@ draft: false
 ---
 
 import ColorsTable from 'Pages/quickguide-designer/colors-table.md'
-import bluegridSvg from 'Root/static/assets/images/grid-32x32-blue.svg'
 
 # Colors
 
diff --git a/packages/dnb-design-system-portal/src/shared/menu/ToggleGrid.js b/packages/dnb-design-system-portal/src/shared/menu/ToggleGrid.js
index e9af4806e08..51a6260e668 100644
--- a/packages/dnb-design-system-portal/src/shared/menu/ToggleGrid.js
+++ b/packages/dnb-design-system-portal/src/shared/menu/ToggleGrid.js
@@ -4,18 +4,14 @@
  */
 
 import React, { Component } from 'react'
-// import PropTypes from 'prop-types'
 import { css, Global } from '@emotion/core'
 import styled from '@emotion/styled'
 import { FormLabel, Switch } from 'dnb-ui-lib/src'
-import gridSvg from '../../../static/assets/images/grid-32x32.svg'
+import { gridStyle } from '../parts/PortalStyle'
 
 const globalStyle = css`
   .dev-grid {
-    background-repeat: repeat;
-    background-attachment: fixed;
-    background-color: transparent;
-    background-image: url(${gridSvg});
+    ${gridStyle({ rgb: '220, 220, 220', a: 0.8 })}
 
     h1,
     h2,
@@ -34,10 +30,6 @@ const globalStyle = css`
       display: block;
     }
   }
-
-  .grid-not-fixed {
-    background-attachment: local;
-  }
 `
 
 const ToggleWrapper = styled.span`
diff --git a/packages/dnb-design-system-portal/src/shared/parts/PortalStyle.js b/packages/dnb-design-system-portal/src/shared/parts/PortalStyle.js
index 53a7b9de219..0b53c2ba8c2 100644
--- a/packages/dnb-design-system-portal/src/shared/parts/PortalStyle.js
+++ b/packages/dnb-design-system-portal/src/shared/parts/PortalStyle.js
@@ -4,9 +4,69 @@
  */
 
 import { css } from '@emotion/core'
-import bluegridSvg from '../../../static/assets/images/grid-32x32-blue.svg'
-import greygridSvg from '../../../static/assets/images/grid-32x32.svg'
-import lightgreygridSvg from '../../../static/assets/images/grid-32x32-lightgrey.svg'
+
+export const gridStyle = ({
+  rgb = null,
+  hsl = '204, 80%, 72%',
+  a = 0.8
+} = {}) => {
+  const color = c =>
+    rgb ? `rgba(${rgb}, ${a - c})` : `hsla(${hsl}, ${a - c})`
+  return css`
+    --grid-gutter: 0.5rem;
+    --grid-gutter-bold: 2rem;
+    --grid-color: ${color(0.5)};
+    --grid-color-bold: ${color(0.15)};
+    --grid-line-thickness: 1px;
+
+    --grid-columns: repeating-linear-gradient(
+      to right,
+      var(--grid-color),
+      var(--grid-color) var(--grid-line-thickness),
+      transparent var(--grid-line-thickness),
+      transparent var(--grid-gutter)
+    );
+    --grid-columns-bold: repeating-linear-gradient(
+      to right,
+      var(--grid-color-bold),
+      var(--grid-color-bold) var(--grid-line-thickness),
+      transparent var(--grid-line-thickness),
+      transparent var(--grid-gutter-bold)
+    );
+    --grid-rows: repeating-linear-gradient(
+      to bottom,
+      var(--grid-color),
+      var(--grid-color) var(--grid-line-thickness),
+      transparent var(--grid-line-thickness),
+      transparent var(--grid-gutter)
+    );
+    --grid-rows-bold: repeating-linear-gradient(
+      to bottom,
+      var(--grid-color-bold),
+      var(--grid-color-bold) var(--grid-line-thickness),
+      transparent var(--grid-line-thickness),
+      transparent var(--grid-gutter-bold)
+    );
+
+    border-bottom: solid var(--grid-line-thickness) var(--grid-color-bold);
+    border-right: solid var(--grid-line-thickness) var(--grid-color-bold);
+
+    &::after {
+      content: '';
+
+      position: absolute;
+      z-index: -1;
+      top: 0;
+      left: 0;
+
+      width: 100%;
+      height: 100%;
+
+      background-image: var(--grid-columns), var(--grid-columns-bold),
+        var(--grid-rows), var(--grid-rows-bold);
+    }
+  `
+}
 
 export default css`
   table td.selectable {
@@ -133,13 +193,7 @@ export default css`
 
     text-align: center;
 
-    border-bottom: solid 1px #e7e8e7;
-    border-right: solid 1px #e7e8e7;
-
-    background-color: #f9ffff;
-    background-repeat: repeat;
-    background-image: url(${greygridSvg});
-    ${'' /* background-image: url('/assets/images/grid-32x32.svg'); */}
+    ${gridStyle({ rgb: '231, 232, 231', a: 0.8 })}
 
     figcaption {
       padding-top: 0.9375rem;
@@ -160,13 +214,7 @@ export default css`
     margin-bottom: 4rem;
     padding: 2rem 2rem 1.9375rem 2rem;
 
-    background-color: #f9ffff;
-    border-bottom: solid 1px #a4ffff;
-    border-right: solid 1px #a4ffff;
-
-    background-repeat: repeat;
-    background-image: url(${bluegridSvg});
-    ${'' /* background-image: url('/assets/images/grid-32x32.svg'); */}
+    ${gridStyle({ rgb: '164, 255, 255', a: 0.8 })}
 
     h1 {
       margin-top: 0rem;
@@ -196,15 +244,13 @@ export default css`
   }
 
   div.example-box {
+    position: relative;
+    overflow: hidden;
+
     margin-bottom: 2rem;
     padding: 2rem;
 
-    background-color: #fff;
-    border-bottom: solid 1px #ececec;
-    border-right: solid 1px #ececec;
-
-    background-repeat: repeat;
-    background-image: url(${lightgreygridSvg});
+    ${gridStyle({ rgb: '236, 236, 236', a: 1 })}
 
     &.center {
       display: flex;
@@ -213,8 +259,8 @@ export default css`
     }
   }
   p.example-caption {
-    padding-top: 0.9375rem;
     margin-top: 2rem;
+    padding-top: 0.9375rem;
 
     font-size: 1em;
     line-height: 1.5rem;
diff --git a/packages/dnb-design-system-portal/static/assets/images/dotted-grey-grid-bg.svg b/packages/dnb-design-system-portal/static/assets/images/dotted-grey-grid-bg.svg
deleted file mode 100644
index 6b7e3080f57..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/dotted-grey-grid-bg.svg
+++ /dev/null
@@ -1,148 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="31" height="31" viewBox="0 0 31 31">
-  <g fill="none" fill-rule="evenodd">
-    <g fill="#E9E9E9">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#F3F3F3" transform="translate(0 8)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#F3F3F3" transform="translate(0 16)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#F3F3F3" transform="translate(0 24)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#E9E9E9" transform="rotate(90 .5 .5)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#F3F3F3" transform="rotate(90 4.5 4.5)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#F3F3F3" transform="rotate(90 8.5 8.5)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-    <g fill="#F3F3F3" transform="rotate(90 12.5 12.5)">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" x="2"/>
-      <rect width="1" height="1" x="4"/>
-      <rect width="1" height="1" x="6"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="10"/>
-      <rect width="1" height="1" x="12"/>
-      <rect width="1" height="1" x="14"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="18"/>
-      <rect width="1" height="1" x="20"/>
-      <rect width="1" height="1" x="22"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="26"/>
-      <rect width="1" height="1" x="28"/>
-      <rect width="1" height="1" x="30"/>
-    </g>
-  </g>
-</svg>
diff --git a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-blue.svg b/packages/dnb-design-system-portal/static/assets/images/grid-32x32-blue.svg
deleted file mode 100644
index a388c0ad1cb..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-blue.svg
+++ /dev/null
@@ -1,12 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-  <g fill="none" fill-rule="evenodd">
-    <rect width="32" height="1" fill="#A4FFFF"/>
-    <rect width="32" height="1" y="8" fill="#DAFFFF"/>
-    <rect width="32" height="1" y="16" fill="#DAFFFF"/>
-    <rect width="32" height="1" y="24" fill="#DAFFFF"/>
-    <rect width="1" height="31" x="8" y="1" fill="#DAFFFF" transform="matrix(1 0 0 -1 0 33)"/>
-    <rect width="1" height="31" x="16" y="1" fill="#DAFFFF" transform="matrix(1 0 0 -1 0 33)"/>
-    <rect width="1" height="31" x="24" y="1" fill="#DAFFFF" transform="matrix(1 0 0 -1 0 33)"/>
-    <rect width="1" height="31" y="1" fill="#A4FFFF" transform="matrix(1 0 0 -1 0 33)"/>
-  </g>
-</svg>
diff --git a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-dark.svg b/packages/dnb-design-system-portal/static/assets/images/grid-32x32-dark.svg
deleted file mode 100644
index 07c569584e7..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-dark.svg
+++ /dev/null
@@ -1,32 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-  <g fill="none" fill-rule="evenodd">
-    <g fill="#000000" fill-rule="nonzero" opacity=".696">
-      <polygon points="0 0 7.159 0 32 0 32 1 0 1" opacity=".25"/>
-      <polygon points="0 0 .224 0 1 0 1 32 0 32" opacity=".25"/>
-      <polygon points="8 0 8.224 0 9 0 9 32 8 32" opacity=".06"/>
-      <polygon points="16 0 16.224 0 17 0 17 32 16 32" opacity=".06"/>
-      <polygon points="24 0 24.224 0 25 0 25 32 24 32" opacity=".06"/>
-      <polygon points="0 8 7.159 8 32 8 32 9 0 9" opacity=".06"/>
-      <polygon points="0 16 7.159 16 32 16 32 17 0 17" opacity=".06"/>
-      <polygon points="0 24 7.159 24 32 24 32 25 0 25" opacity=".06"/>
-    </g>
-    <g fill="#B2B2B2">
-      <rect width="1" height="1"/>
-      <rect width="1" height="1" y="8"/>
-      <rect width="1" height="1" y="16"/>
-      <rect width="1" height="1" y="24"/>
-      <rect width="1" height="1" x="8"/>
-      <rect width="1" height="1" x="8" y="8"/>
-      <rect width="1" height="1" x="8" y="16"/>
-      <rect width="1" height="1" x="8" y="24"/>
-      <rect width="1" height="1" x="16"/>
-      <rect width="1" height="1" x="16" y="8"/>
-      <rect width="1" height="1" x="16" y="16"/>
-      <rect width="1" height="1" x="16" y="24"/>
-      <rect width="1" height="1" x="24"/>
-      <rect width="1" height="1" x="24" y="8"/>
-      <rect width="1" height="1" x="24" y="16"/>
-      <rect width="1" height="1" x="24" y="24"/>
-    </g>
-  </g>
-</svg>
diff --git a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-green.svg b/packages/dnb-design-system-portal/static/assets/images/grid-32x32-green.svg
deleted file mode 100644
index 89ab59160b6..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-green.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 0H0V8H1V1H8V0H1Z" fill="#008484"/>
-</svg>
diff --git a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-lightgrey.svg b/packages/dnb-design-system-portal/static/assets/images/grid-32x32-lightgrey.svg
deleted file mode 100644
index 84d0f46899d..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-lightgrey.svg
+++ /dev/null
@@ -1,20 +0,0 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 0H0V8H1V1H8V0H1Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 0H8V8H9V1H16V0H9Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 0H16V8H17V1H24V0H17Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 0H24V8H25V1H32V0H25Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 8H0V16H1V9H8V8H1Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 8H8V16H9V9H16V8H9Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 8H16V16H17V9H24V8H17Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 8H24V16H25V9H32V8H25Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 16H0V24H1V17H8V16H1Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 16H8V24H9V17H16V16H9Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 16H16V24H17V17H24V16H17Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 16H24V24H25V17H32V16H25Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 24H0V32H1V25H8V24H1Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 24H8V32H9V25H16V24H9Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 24H16V32H17V25H24V24H17Z" fill="#D2D2D2"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 24H24V32H25V25H32V24H25Z" fill="#D2D2D2"/>
-<rect width="1" height="32" fill="#ECECEC"/>
-<rect x="1" width="31" height="1" fill="#ECECEC"/>
-</svg>
diff --git a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-pink.svg b/packages/dnb-design-system-portal/static/assets/images/grid-32x32-pink.svg
deleted file mode 100644
index adadeccef4f..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/grid-32x32-pink.svg
+++ /dev/null
@@ -1,20 +0,0 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 0H0V8H1V1H8V0H1Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 0H8V8H9V1H16V0H9Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 0H16V8H17V1H24V0H17Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 0H24V8H25V1H32V0H25Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 8H0V16H1V9H8V8H1Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 8H8V16H9V9H16V8H9Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 8H16V16H17V9H24V8H17Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 8H24V16H25V9H32V8H25Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 16H0V24H1V17H8V16H1Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 16H8V24H9V17H16V16H9Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 16H16V24H17V17H24V16H17Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 16H24V24H25V17H32V16H25Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M1 24H0V32H1V25H8V24H1Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M9 24H8V32H9V25H16V24H9Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M17 24H16V32H17V25H24V24H17Z" fill="#DB00FF" fill-opacity="0.5"/>
-<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M25 24H24V32H25V25H32V24H25Z" fill="#DB00FF" fill-opacity="0.5"/>
-<rect width="1" height="32" fill="#DB00FF" fill-opacity="0.25"/>
-<rect x="1" width="31" height="1" fill="#DB00FF" fill-opacity="0.25"/>
-</svg>
diff --git a/packages/dnb-design-system-portal/static/assets/images/grid-32x32.svg b/packages/dnb-design-system-portal/static/assets/images/grid-32x32.svg
deleted file mode 100644
index 4bcbc581572..00000000000
--- a/packages/dnb-design-system-portal/static/assets/images/grid-32x32.svg
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-  <g fill="none" fill-rule="evenodd">
-    <rect width="32" height="32" fill="#F7F7F7"/>
-    <polygon fill="#D8D8D8" points="0 0 7.159 0 32 0 32 1 0 1" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="0 0 .224 0 1 0 1 32 0 32" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="8 0 8.224 0 9 0 9 32 8 32" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="16 0 16.224 0 17 0 17 32 16 32" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="24 0 24.224 0 25 0 25 32 24 32" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="0 8 7.159 8 32 8 32 9 0 9" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="0 16 7.159 16 32 16 32 17 0 17" opacity=".5"/>
-    <polygon fill="#D8D8D8" points="0 24 7.159 24 32 24 32 25 0 25" opacity=".5"/>
-  </g>
-</svg>
diff --git a/packages/dnb-ui-lib/src/style/core/dnb-style.scss b/packages/dnb-ui-lib/src/style/core/dnb-style.scss
index bee84bf60fb..9f898785f7b 100644
--- a/packages/dnb-ui-lib/src/style/core/dnb-style.scss
+++ b/packages/dnb-ui-lib/src/style/core/dnb-style.scss
@@ -265,7 +265,6 @@
     code,
     * code {
       margin: 0;
-      padding: 0.2rem 0.4rem;
 
       font-size: 0.875em;
       background-color: var(--color-mint-green-25);