diff --git a/js/notebook/src/BeakerXThemeHelper.ts b/js/notebook/src/BeakerXThemeHelper.ts
index c957199a8d..473803d396 100644
--- a/js/notebook/src/BeakerXThemeHelper.ts
+++ b/js/notebook/src/BeakerXThemeHelper.ts
@@ -61,6 +61,14 @@ export default class BeakerXThemeHelper {
     return this.isDark ? 'rgb(26, 26, 26)' : 'rgb(249, 249, 249)';
   }
 
+  public  static get MIN_LIGHTNESS_VALUE(): number {
+    return this.isDark ? 15 : 35;
+  }
+
+  public  static get MIN_SATURATION_VALUE(): number {
+    return this.isDark ? 15 : 35;
+  }
+
   private static getDarkStyle(): DataGrid.IStyle {
     return {
     ...DataGrid.defaultStyle,
diff --git a/js/notebook/src/tableDisplay/dataGrid/highlighter/UniqueEntriesHighlighter.ts b/js/notebook/src/tableDisplay/dataGrid/highlighter/UniqueEntriesHighlighter.ts
index c223e727cd..5bd6641f38 100644
--- a/js/notebook/src/tableDisplay/dataGrid/highlighter/UniqueEntriesHighlighter.ts
+++ b/js/notebook/src/tableDisplay/dataGrid/highlighter/UniqueEntriesHighlighter.ts
@@ -24,8 +24,6 @@ import BeakerXThemeHelper from "../../../BeakerXThemeHelper";
 
 const MAX_HUE_VALUE = 360;
 const DEFAULT_HSL_COMPONENT_STEPS_COUNT = 50;
-const MIN_SATURATION_VALUE = 35;
-const MIN_LIGHTNESS_VALUE = 35;
 
 export default class UniqueEntriesHighlighter extends Highlighter {
   uniqueValues: any[] = [];
@@ -95,8 +93,8 @@ export default class UniqueEntriesHighlighter extends Highlighter {
         lightnessStepCount += 1;
       }
 
-      let saturation = MIN_SATURATION_VALUE + saturationRatio * DEFAULT_HSL_COMPONENT_STEPS_COUNT;
-      let lightness = MIN_LIGHTNESS_VALUE + lightnessRatio * DEFAULT_HSL_COMPONENT_STEPS_COUNT;
+      let saturation = BeakerXThemeHelper.MIN_SATURATION_VALUE + saturationRatio * DEFAULT_HSL_COMPONENT_STEPS_COUNT;
+      let lightness = BeakerXThemeHelper.MIN_LIGHTNESS_VALUE + lightnessRatio * DEFAULT_HSL_COMPONENT_STEPS_COUNT;
 
       return `hsl(${hue}, ${saturation}%, ${lightness}%)`;
     }