diff --git a/src/color/creating_reading.js b/src/color/creating_reading.js
index 3684cc13dd..3a03100b1a 100644
--- a/src/color/creating_reading.js
+++ b/src/color/creating_reading.js
@@ -1043,8 +1043,25 @@ function creatingReading(p5, fn){
    * </div>
    */
   fn.hue = function(c) {
-    // p5._validateParameters('hue', arguments);
-    return this.color(c)._getHue();
+    let colorMode = HSL;
+    let i = 0;
+
+    if(
+      this._renderer.states.colorMode === HSB ||
+      this._renderer.states.colorMode === HSL
+    ){
+      colorMode = this._renderer.states.colorMode;
+    }else if(
+      this._renderer.states.colorMode === LCH ||
+      this._renderer.states.colorMode === OKLCH
+    ){
+      colorMode = this._renderer.states.colorMode;
+      i = 2;
+    }
+
+    return this.color(c)._getHue(
+      this._renderer.states.colorMaxes[colorMode][i]
+    );
   };
 
   /**
@@ -1220,8 +1237,10 @@ function creatingReading(p5, fn){
    * </div>
    */
   fn.saturation = function(c) {
-    // p5._validateParameters('saturation', arguments);
-    return this.color(c)._getSaturation();
+    const colorMode = (this._renderer.states.colorMode === HSB) ? HSB : HSL;
+    return this.color(c)._getSaturation(
+      this._renderer.states.colorMaxes[colorMode][1]
+    );
   };
 
   /**
@@ -1365,8 +1384,9 @@ function creatingReading(p5, fn){
    * </div>
    */
   fn.brightness = function(c) {
-    // p5._validateParameters('brightness', arguments);
-    return this.color(c)._getBrightness();
+    return this.color(c)._getBrightness(
+      this._renderer.states.colorMaxes.hsb[2]
+    );
   };
 
   /**
@@ -1510,8 +1530,9 @@ function creatingReading(p5, fn){
    * </div>
    */
   fn.lightness = function(c) {
-    // p5._validateParameters('lightness', arguments);
-    return this.color(c)._getLightness();
+    return this.color(c)._getLightness(
+      this._renderer.states.colorMaxes.hsl[2]
+    );
   };
 
   /**
diff --git a/src/color/p5.Color.js b/src/color/p5.Color.js
index b5a278f30b..03a49618c9 100644
--- a/src/color/p5.Color.js
+++ b/src/color/p5.Color.js
@@ -630,6 +630,7 @@ class Color {
       return map(to(this._color, 'hsl').coords[1], colorjsMax[0], colorjsMax[1], max[0], max[1]);
     }
   }
+
   /**
    * Brightness obtains the HSB brightness value from either a p5.Color object,
    * an array of color components, or a CSS color string.Depending on value,
@@ -637,7 +638,6 @@ class Color {
    * brightness value in the range. By default, this function will return
    * the HSB brightness within the range 0 - 100.
    */
-
   _getBrightness(max=[0, 100]) {
     if(!Array.isArray(max)){
       max = [0, max];