diff --git a/CI-ColorWebs/wwwroot/js/site.js b/CI-ColorWebs/wwwroot/js/site.js
index f50c5eda13505f437cae431db37428f55c88530d..761ed298c3e24b8af9e0423c68d6c20b0546620d 100644
--- a/CI-ColorWebs/wwwroot/js/site.js
+++ b/CI-ColorWebs/wwwroot/js/site.js
@@ -12,27 +12,27 @@ const cre = () => {
     }
     color.innerHTML = "#" + ranColor[0];
     context.fillStyle = '#' +ranColor[0];
-    context.fillRect(110, 0, 70, 100);
+    context.fillRect(0, 0, 116, 150);
     document.getElementById("color").style.color = "#" + ranColor[0];
     color2.innerHTML = "#" + ranColor[1];
     context.fillStyle = '#' +ranColor[1];
-    context.fillRect(180, 0, 70, 100);
+    context.fillRect(116, 0, 116, 150);
     document.getElementById("color2").style.color = "#" + ranColor[1];
     color3.innerHTML = "#" + ranColor[2];
     context.fillStyle = '#' +ranColor[2];
-    context.fillRect(250, 0, 70, 100);
+    context.fillRect(232, 0, 116, 150);
     document.getElementById("color3").style.color = "#" + ranColor[2];
     color4.innerHTML = "#" + ranColor[3];
     context.fillStyle = '#' +ranColor[3];
-    context.fillRect(320, 0, 70, 100);
+    context.fillRect(348, 0, 116, 150);
     document.getElementById("color4").style.color = "#" + ranColor[3];
     color5.innerHTML = "#" + ranColor[4];
     context.fillStyle = '#' +ranColor[4];
-    context.fillRect(390, 0, 70, 100);
+    context.fillRect(464, 0, 116, 150);
     document.getElementById("color5").style.color = "#" + ranColor[4];
     color6.innerHTML = "#" + ranColor[5];
     context.fillStyle = '#' +ranColor[5];
-    context.fillRect(460, 0, 70, 100);
+    context.fillRect(580, 0, 116, 150);
     document.getElementById("color6").style.color = "#" + ranColor[5];
     ailink = "?prompt=flower%20color(" + ranColor[0]+",%20" + ranColor[1]+ ",%20"+ ranColor[2]+ ",%20"+ ranColor[3]+ ",%20"+ ranColor[4]+ ",%20"+ ranColor[5]+ ")%20painting";
     var link = "<a href='https://www.craiyon.com/" + ailink + "'>here</a>";