diff --git a/src/colors/functions.js b/src/colors/functions.js
index 41d355e8728..fdbe7328c17 100644
--- a/src/colors/functions.js
+++ b/src/colors/functions.js
@@ -5,11 +5,11 @@ module.exports = {
 
   generateForegroundColorFrom: function (input, percentage = 0.8) {
     if (Color(input).isDark()) {
-      let arr = Color(input).mix(Color("white"), percentage).saturate(10).hsl().round().array()
-      return arr[0] + " " + arr[1] + "%" + " " + arr[2] + "%";
+      let arr = Color(input).mix(Color("white"), percentage).saturate(10).hsl().array()
+      return arr[0].toPrecision(5).replace(/\.?0+$/,"") + " " + arr[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + arr[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
     } else {
-      let arr = Color(input).mix(Color("black"), percentage).saturate(10).hsl().round().array()
-      return arr[0] + " " + arr[1] + "%" + " " + arr[2] + "%";
+      let arr = Color(input).mix(Color("black"), percentage).saturate(10).hsl().array()
+      return arr[0].toPrecision(5).replace(/\.?0+$/,"") + " " + arr[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + arr[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
     }
   },
 
@@ -18,31 +18,31 @@ module.exports = {
     if (typeof input === "object" && input !== null) {
       Object.entries(input).forEach(([rule, value]) => {
         if (colorNames.hasOwnProperty(rule)) {
-          const hslArray = Color(value).hsl().round().array();
-          resultObj[colorNames[rule]] = hslArray[0] + " " + hslArray[1] + "%" + " " + hslArray[2] + "%";
+          const hslArray = Color(value).hsl().array();
+          resultObj[colorNames[rule]] = hslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + hslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + hslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
         } else {
           resultObj[rule] = value;
         }
 
         // auto generate focus colors
         if (!input.hasOwnProperty("primary-focus")) {
-          const darkerHslArray = Color(input["primary"]).darken(0.2).hsl().round().array();
-          resultObj["--pf"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+          const darkerHslArray = Color(input["primary"]).darken(0.2).hsl().array();
+          resultObj["--pf"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
         }
 
         if (!input.hasOwnProperty("secondary-focus")) {
-          const darkerHslArray = Color(input["secondary"]).darken(0.2).hsl().round().array();
-          resultObj["--sf"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+          const darkerHslArray = Color(input["secondary"]).darken(0.2).hsl().array();
+          resultObj["--sf"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
         }
 
         if (!input.hasOwnProperty("accent-focus")) {
-          const darkerHslArray = Color(input["accent"]).darken(0.2).hsl().round().array();
-          resultObj["--af"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+          const darkerHslArray = Color(input["accent"]).darken(0.2).hsl().array();
+          resultObj["--af"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
         }
 
         if (!input.hasOwnProperty("neutral-focus")) {
-          const darkerHslArray = Color(input["neutral"]).darken(0.2).hsl().round().array();
-          resultObj["--nf"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+          const darkerHslArray = Color(input["neutral"]).darken(0.2).hsl().array();
+          resultObj["--nf"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
         }
 
         // auto generate base colors
@@ -51,17 +51,17 @@ module.exports = {
         }
 
         if (!input.hasOwnProperty("base-200")) {
-          const darkerHslArray = Color(input["base-100"]).darken(0.1).hsl().round().array();
-          resultObj["--b2"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+          const darkerHslArray = Color(input["base-100"]).darken(0.1).hsl().array();
+          resultObj["--b2"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
         }
 
         if (!input.hasOwnProperty("base-300")) {
           if (input.hasOwnProperty("base-200")) {
-            const darkerHslArray = Color(input["base-200"]).darken(0.1).hsl().round().array();
-            resultObj["--b3"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+            const darkerHslArray = Color(input["base-200"]).darken(0.1).hsl().array();
+            resultObj["--b3"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
           } else {
-            const darkerHslArray = Color(input["base-100"]).darken(0.1).darken(0.1).hsl().round().array();
-            resultObj["--b3"] = darkerHslArray[0] + " " + darkerHslArray[1] + "%" + " " + darkerHslArray[2] + "%";
+            const darkerHslArray = Color(input["base-100"]).darken(0.1).darken(0.1).hsl().array();
+            resultObj["--b3"] = darkerHslArray[0].toPrecision(5).replace(/\.?0+$/,"") + " " + darkerHslArray[1].toPrecision(5).replace(/\.?0+$/,"") + "%" + " " + darkerHslArray[2].toPrecision(5).replace(/\.?0+$/,"") + "%";
           }
         }