diff --git a/resources/web/guide/21/21.css b/resources/web/guide/21/21.css
index 2210ff7cc..2a64fb74f 100644
--- a/resources/web/guide/21/21.css
+++ b/resources/web/guide/21/21.css
@@ -64,21 +64,14 @@
 	height: 20px;
 	right: 10px;
 	top: 10px;
-    border:1px solid #ADADAD;
-	background-color: #FFF;
-	padding: 1px;
 	cursor: pointer;
+	background-image: url("../img/emptycheck.svg");
+	background-size: cover;
 }
 
-.ModelCheckBox.ModelCheckBoxSelected img
+.ModelCheckBox.ModelCheckBoxSelected
 {
-	display:inline;
-}
-
-.ModelCheckBox img
-{
-	width:100%;
-	display: none;
+	background-image: url("../img/greencheck.svg");
 }
 
 img.ModelThumbnail
diff --git a/resources/web/guide/21/21.js b/resources/web/guide/21/21.js
index c00f6222f..2a4a84038 100644
--- a/resources/web/guide/21/21.js
+++ b/resources/web/guide/21/21.js
@@ -114,7 +114,7 @@ function HandleModelList( pVal )
 		ModelHtml[strVendor]+='<div class="PrinterBlock">'+
         '<div class="PImg">'+
 		    '<img class="ModelThumbnail" src="'+CoverImage3+'" onerror="ShowPrinterThumb(this,\''+CoverImage2+'\')" />'+
-			'<div class="ModelCheckBox" model="'+OneModel['model']+'" onClick="ChooseModel(\''+OneModel['model']+'\')"><img src="../img/greencheck.svg" /></div>'+
+			'<div class="ModelCheckBox" model="'+OneModel['model']+'" onClick="ChooseModel(\''+OneModel['model']+'\')"></div>'+
 		'</div>'+
         '    <div class="PName">'+OneModel['model']+'</div>'+ 
 		'</div>';
diff --git a/resources/web/guide/21/index.html b/resources/web/guide/21/index.html
index 1f04d7c25..13d131b1f 100644
--- a/resources/web/guide/21/index.html
+++ b/resources/web/guide/21/index.html
@@ -35,7 +35,7 @@
 <div class="PrinterBlock">
 	<div class="PImg">
 		<img class="ModelThumbnail" src="p2.jpg"  />
-        <div class="ModelCheckBox ModelCheckBoxSelected" model="BBL-3DP-V5NORMAL" onClick="ChooseModel('BBL-3DP-V5NORMAL')"><img class="" src="../img/greencheck.svg" /></div>		
+        <div class="ModelCheckBox ModelCheckBoxSelected" model="BBL-3DP-V5NORMAL" onClick="ChooseModel('BBL-3DP-V5NORMAL')"></div>		
 	</div>	
     <div class="PName">BBL-3DP-V4NORMAL</div>
     <div class="pNozzel TextS2"><input id="ZZ" type="checkbox" model="BBL-3DP-V4NORMAL" nozzel="0.4" vendor="BBL" />0.4mm nozzle</div>
@@ -44,7 +44,7 @@
 <div class="PrinterBlock">
 	<div class="PImg">
 		<img class="ModelThumbnail" src="p2.jpg"  />
-        <div class="ModelCheckBox"><img class="" src="../img/greencheck.svg" /></div>		
+        <div class="ModelCheckBox"></div>
 	</div>	
     <div class="PName">BBL-3DP-V4NORMAL</div>
     <div class="pNozzel TextS2"><input type="checkbox" model="BBL-3DP-V5NORMAL" nozzel="0.4" vendor="BBL" />0.4mm nozzle</div>
@@ -54,7 +54,7 @@
 <div class="PrinterBlock">
 	<div class="PImg">
 		<img class="ModelThumbnail" src="p2.jpg"  />
-        <div class="ModelCheckBox"><img class="" src="../img/greencheck.svg" /></div>		
+        <div class="ModelCheckBox"></div>
 	</div>	
     <div class="PName">BBL-3DP-V4NORMAL</div>
     <div class="pNozzel TextS2"><input id="ZZ" type="checkbox" model="BBL-3DP-V4NORMAL" nozzel="0.4" vendor="BBL" />0.4mm nozzle</div>
@@ -63,7 +63,7 @@
 <div class="PrinterBlock">
 	<div class="PImg">
 		<img class="ModelThumbnail" src="p2.jpg"  />
-        <div class="ModelCheckBox ModelCheckBoxSelected"><img class="" src="../img/greencheck.svg" /></div>		
+        <div class="ModelCheckBox ModelCheckBoxSelected"></div>		
 	</div>	
     <div class="PName">BBL-3DP-V4NORMAL</div>
     <div class="pNozzel TextS2"><input type="checkbox" model="BBL-3DP-V5NORMAL" nozzel="0.4" vendor="BBL" />0.4mm nozzle</div>
@@ -89,7 +89,7 @@
 <div class="PrinterBlock">
 	<div class="PImg">
 		<img class="ModelThumbnail" src="p2.jpg"  />
-        <div class="ModelCheckBox ModelCheckBoxSelected"><img class="" src="../img/greencheck.svg" /></div>		
+        <div class="ModelCheckBox ModelCheckBoxSelected"></div>		
 	</div>	
     <div class="PName TextS1">BBL-3DP-V4NORMAL</div>
     <div class="pNozzel TextS2"><input type="checkbox" model="BBL-3DP-V4NORMAL" nozzel="0.4" vendor="BAMBU" />0.4mm nozzle</div>
@@ -98,7 +98,7 @@
 <div class="PrinterBlock">
 	<div class="PImg">
 		<img class="ModelThumbnail" src="p2.jpg"  />
-        <div class="ModelCheckBox ModelCheckBoxSelected"><img class="" src="../img/greencheck.svg" /></div>		
+        <div class="ModelCheckBox ModelCheckBoxSelected"></div>		
 	</div>	
     <div class="PName TextS1">BBL-3DP-V4NORMAL</div>
     <div class="pNozzel TextS2"><input type="checkbox" model="BBL-3DP-V5NORMAL" nozzel="0.4" vendor="BAMBU" />0.4mm nozzle</div>
diff --git a/resources/web/guide/24/24.css b/resources/web/guide/24/24.css
index a78f949c4..6586acdae 100644
--- a/resources/web/guide/24/24.css
+++ b/resources/web/guide/24/24.css
@@ -63,21 +63,14 @@
 	height: 20px;
 	right: 10px;
 	top: 10px;
-    border:1px solid #ADADAD;
-	background-color: #FFF;
-	padding: 1px;
 	cursor: pointer;
+	background-image: url("../img/emptycheck.svg");
+	background-size: cover;
 }
 
-.ModelCheckBox.ModelCheckBoxSelected img
+.ModelCheckBox.ModelCheckBoxSelected
 {
-	display:inline;
-}
-
-.ModelCheckBox img
-{
-	width:100%;
-	display: none;
+	background-image: url("../img/greencheck.svg");
 }
 
 img.ModelThumbnail
diff --git a/resources/web/guide/24/24.js b/resources/web/guide/24/24.js
index 16ea30838..0acfe79d4 100644
--- a/resources/web/guide/24/24.js
+++ b/resources/web/guide/24/24.js
@@ -113,7 +113,7 @@ function HandleModelList( pVal )
 		ModelHtml[strVendor]+='<div class="PrinterBlock">'+
         '<div class="PImg">'+
 		    '<img class="ModelThumbnail" src="'+CoverImage3+'" onerror="ShowPrinterThumb(this,\''+CoverImage2+'\')" />'+
-			'<div class="ModelCheckBox" model="'+OneModel['model']+'" onClick="ChooseModel(\''+OneModel['model']+'\')"><img src="../img/greencheck.svg" /></div>'+
+			'<div class="ModelCheckBox" model="'+OneModel['model']+'" onClick="ChooseModel(\''+OneModel['model']+'\')"></div>'+
 		'</div>'+
         '    <div class="PName">'+OneModel['model']+'</div>'+ 
 		'</div>';
diff --git a/resources/web/guide/img/emptycheck.svg b/resources/web/guide/img/emptycheck.svg
new file mode 100644
index 000000000..259a06049
--- /dev/null
+++ b/resources/web/guide/img/emptycheck.svg
@@ -0,0 +1,5 @@
+<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M1 1H27V27H1V1ZM2 2V26H26V2H2Z" fill="#ACACAC"/>
+<path d="M2 2H26V26H2V2Z" fill="white" fill-opacity="0.3"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M25 3H3V25H25V3ZM2 2V26H26V2H2Z" fill="white"/>
+</svg>
diff --git a/resources/web/guide/img/greencheck.svg b/resources/web/guide/img/greencheck.svg
index 65e8b8705..79e6871a8 100644
--- a/resources/web/guide/img/greencheck.svg
+++ b/resources/web/guide/img/greencheck.svg
@@ -1 +1,7 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1740057651953" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1463" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M910.222222 0a113.777778 113.777778 0 0 1 113.777778 113.777778v796.444444a113.777778 113.777778 0 0 1-113.777778 113.777778H113.777778a113.777778 113.777778 0 0 1-113.777778-113.777778V113.777778a113.777778 113.777778 0 0 1 113.777778-113.777778h796.444444z m-114.915555 320.739556a45.909333 45.909333 0 0 0-65.080889 0l-310.897778 310.897777-135.907556-135.964444a45.909333 45.909333 0 0 0-65.080888 0 45.909333 45.909333 0 0 0 0 65.137778l168.561777 168.448a45.909333 45.909333 0 0 0 65.080889 0l343.608889-343.552a45.738667 45.738667 0 0 0-0.284444-64.967111z" fill="#00AE42" p-id="1464"></path></svg>
\ No newline at end of file
+<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 2H26V26H2V2Z" fill="#00AE42"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M1 1H27V27H1V1ZM2 2V26H26V2H2Z" fill="#ACACAC"/>
+<path d="M2 2H26V26H2V2Z" fill="#00AE42"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M25 3H3V25H25V3ZM2 2V26H26V2H2Z" fill="white"/>
+<path d="M22.7168 8.2832C23.0944 8.66079 23.0944 9.27137 22.7168 9.64495L12.112 20.2537C11.7344 20.6313 11.1239 20.6313 10.7503 20.2537L5.2832 14.7907C4.9056 14.4131 4.9056 13.8025 5.2832 13.4289C5.66079 13.0553 6.27137 13.0513 6.64495 13.4289L11.4251 18.2091L21.351 8.2832C21.7286 7.9056 22.3392 7.9056 22.7128 8.2832H22.7168Z" fill="white"/>
+</svg>