diff --git a/public/images/board/svg/blue.svg b/public/images/board/svg/blue.svg
index 1a06318edcf3a..869c0776d0190 100644
--- a/public/images/board/svg/blue.svg
+++ b/public/images/board/svg/blue.svg
@@ -1,18 +1,19 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 800">
-<rect width="800" height="800" fill="#8ca2ad"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:x="http://www.w3.org/1999/xlink"
+     viewBox="0 0 8 8" shape-rendering="geometricPrecision">
+<rect width="8" height="8" fill="#8ca2ad"/>
 <g id="a">
   <g id="b">
     <g id="c">
       <g id="d">
-        <rect width="100" height="100" fill="#dee3e6" id="e"/>
-        <use x="200" xlink:href="#e"/>
+        <rect width="1" height="1" fill="#dee3e6" id="e"/>
+        <use x="2" href="#e" x:href="#e"/>
       </g>
-      <use x="400" xlink:href="#d"/>
+      <use x="4" href="#d" x:href="#d"/>
     </g>
-    <use x="100" y="100" xlink:href="#c"/>
+    <use x="1" y="1" href="#c" x:href="#c"/>
   </g>
-  <use y="200" xlink:href="#b"/>
+  <use y="2" href="#b" x:href="#b"/>
 </g>
-<use y="400" xlink:href="#a"/>
+<use y="4" href="#a" x:href="#a"/>
 </svg>
diff --git a/public/images/board/svg/brown.svg b/public/images/board/svg/brown.svg
index 7199683322b8d..24cfa8d5259ac 100644
--- a/public/images/board/svg/brown.svg
+++ b/public/images/board/svg/brown.svg
@@ -1,18 +1,19 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 800">
-<rect width="800" height="800" fill="#b58863"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:x="http://www.w3.org/1999/xlink"
+     viewBox="0 0 8 8" shape-rendering="geometricPrecision">
+<rect width="8" height="8" fill="#b58863"/>
 <g id="a">
   <g id="b">
     <g id="c">
       <g id="d">
-        <rect width="100" height="100" fill="#f0d9b5" id="e"/>
-        <use x="200" xlink:href="#e"/>
+        <rect width="1" height="1" fill="#f0d9b5" id="e"/>
+        <use x="2" href="#e" x:href="#e"/>
       </g>
-      <use x="400" xlink:href="#d"/>
+      <use x="4" href="#d" x:href="#d"/>
     </g>
-    <use x="100" y="100" xlink:href="#c"/>
+    <use x="1" y="1" href="#c" x:href="#c"/>
   </g>
-  <use y="200" xlink:href="#b"/>
+  <use y="2" href="#b" x:href="#b"/>
 </g>
-<use y="400" xlink:href="#a"/>
+<use y="4" href="#a" x:href="#a"/>
 </svg>
diff --git a/public/images/board/svg/green.svg b/public/images/board/svg/green.svg
index 33753365d3698..329daee420e16 100644
--- a/public/images/board/svg/green.svg
+++ b/public/images/board/svg/green.svg
@@ -1,18 +1,19 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 800">
-<rect width="800" height="800" fill="#86a666"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:x="http://www.w3.org/1999/xlink"
+     viewBox="0 0 8 8" shape-rendering="geometricPrecision">
+<rect width="8" height="8" fill="#86a666"/>
 <g id="a">
   <g id="b">
     <g id="c">
       <g id="d">
-        <rect width="100" height="100" fill="#ffffdd" id="e"/>
-        <use x="200" xlink:href="#e"/>
+        <rect width="1" height="1" fill="#ffffdd" id="e"/>
+        <use x="2" href="#e" x:href="#e"/>
       </g>
-      <use x="400" xlink:href="#d"/>
+      <use x="4" href="#d" x:href="#d"/>
     </g>
-    <use x="100" y="100" xlink:href="#c"/>
+    <use x="1" y="1" href="#c" x:href="#c"/>
   </g>
-  <use y="200" xlink:href="#b"/>
+  <use y="2" href="#b" x:href="#b"/>
 </g>
-<use y="400" xlink:href="#a"/>
+<use y="4" href="#a" x:href="#a"/>
 </svg>
diff --git a/public/images/board/svg/purple.svg b/public/images/board/svg/purple.svg
index fb608a5824adc..b96436973e5d5 100644
--- a/public/images/board/svg/purple.svg
+++ b/public/images/board/svg/purple.svg
@@ -1,18 +1,19 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 800">
-<rect width="800" height="800" fill="#7d4a8d"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:x="http://www.w3.org/1999/xlink"
+     viewBox="0 0 8 8" shape-rendering="geometricPrecision">
+<rect width="8" height="8" fill="#7d4a8d"/>
 <g id="a">
   <g id="b">
     <g id="c">
       <g id="d">
-        <rect width="100" height="100" fill="#9f90b0" id="e"/>
-        <use x="200" xlink:href="#e"/>
+        <rect width="1" height="1" fill="#9f90b0" id="e"/>
+        <use x="2" href="#e" x:href="#e"/>
       </g>
-      <use x="400" xlink:href="#d"/>
+      <use x="4" href="#d" x:href="#d"/>
     </g>
-    <use x="100" y="100" xlink:href="#c"/>
+    <use x="1" y="1" href="#c" x:href="#c"/>
   </g>
-  <use y="200" xlink:href="#b"/>
+  <use y="2" href="#b" x:href="#b"/>
 </g>
-<use y="400" xlink:href="#a"/>
+<use y="4" href="#a" x:href="#a"/>
 </svg>