From 25d65c5f0095127cda9493e130b710b8f8e2e039 Mon Sep 17 00:00:00 2001
From: Elias Wainberg <elias.wainberg@ucf.edu>
Date: Tue, 24 Feb 2026 15:02:24 -0500
Subject: [PATCH] Adds color text name matching

---
 assets/js/Components/Forms/ContrastForm.js | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/assets/js/Components/Forms/ContrastForm.js b/assets/js/Components/Forms/ContrastForm.js
index bfbc39cb0..1249e5c99 100644
--- a/assets/js/Components/Forms/ContrastForm.js
+++ b/assets/js/Components/Forms/ContrastForm.js
@@ -19,11 +19,21 @@ export default function ContrastForm({
   handleIssueSave,
   markAsReviewed,
 }) {
+
+  const GRADIENT_KEYWORDS = new Set([
+    'linear', 'radial', 'repeating-linear', 'repeating-radial', 'gradient',
+    'to', 'top', 'bottom', 'left', 'right', 'circle', 'ellipse', 'at', 'center'
+  ]);
+
   // Extract color strings from gradients
+  // Regex matches color codes and names, keywords are excluded to just leave colors
   const extractColors = (gradientString) => {
-    const colorRegex = /#(?:[0-9a-fA-F]{3,8})\b|(?:rgba?|hsla?)\([^)]*\)/g
-    return gradientString.match(colorRegex) || []
-  }
+    const colorRegex = /#(?:[0-9a-fA-F]{3,8})\b|(?:rgba?|hsla?)\([^)]*\)|\b[a-zA-Z]+\b/g;
+    const matches = gradientString.match(colorRegex) || [];
+    return matches.filter(
+      c => !GRADIENT_KEYWORDS.has(c.toLowerCase())
+    );
+  };
 
   // Get all background colors (including gradients)
   const getBackgroundColors = () => {