diff --git a/app/client/packages/wds/src/utils/colors.ts b/app/client/packages/wds/src/utils/colors.ts
index e6db2c46ca..db0de362d8 100644
--- a/app/client/packages/wds/src/utils/colors.ts
+++ b/app/client/packages/wds/src/utils/colors.ts
@@ -1,5 +1,47 @@
 import Color from "colorjs.io";
 
+/* Color Utility Functions. Lightness */
+
+export const isVeryDark = (hex = "#000") => {
+  return parseColor(hex).oklch.l < 30;
+};
+
+export const isVeryLight = (hex = "#000") => {
+  return parseColor(hex).oklch.l > 90;
+};
+
+/* Chroma */
+
+export const isAchromatic = (hex = "#000") => {
+  return parseColor(hex).oklch.c < 5;
+};
+
+export const isColorful = (hex = "#000") => {
+  return parseColor(hex).oklch.c > 17;
+};
+
+/* Hue */
+
+export const isCold = (hex = "#000") => {
+  return parseColor(hex).oklch.h >= 120 && parseColor(hex).oklch.h <= 300;
+};
+
+export const isBlue = (hex = "#000") => {
+  return parseColor(hex).oklch.h >= 230 && parseColor(hex).oklch.h <= 270;
+};
+
+export const isGreen = (hex = "#000") => {
+  return parseColor(hex).oklch.h >= 105 && parseColor(hex).oklch.h <= 165;
+};
+
+export const isYellow = (hex = "#000") => {
+  return parseColor(hex).oklch.h >= 60 && parseColor(hex).oklch.h <= 75;
+};
+
+export const isRed = (hex = "#000") => {
+  return parseColor(hex).oklch.h >= 29 && parseColor(hex).oklch.h <= 50;
+};
+
 /**
  * returns black or white based on the constrast of the color compare to white
  * using APCA algorithm