feat: update color value detection for cssVars (#8901)

shadcn · web-flow · commit 62218c1c0c79 · 2025-11-27T21:12:31.000+04:00
diff --git a/.changeset/weak-planets-smell.md b/.changeset/weak-planets-smell.md
@@ -0,0 +1,5 @@
+---
+"shadcn": patch
+---
+
+update color value detection for cssVars
diff --git a/packages/shadcn/src/utils/updaters/update-css-vars.ts b/packages/shadcn/src/utils/updaters/update-css-vars.ts
@@ -898,6 +898,6 @@ export function isColorValue(value: string) {
     value.startsWith("rgb") ||
     value.startsWith("#") ||
     value.startsWith("oklch") ||
-    value.startsWith("var(--color-")
+    value.includes("--color-")
   )
 }
diff --git a/packages/shadcn/test/utils/updaters/update-css-vars.test.ts b/packages/shadcn/test/utils/updaters/update-css-vars.test.ts
@@ -1417,6 +1417,8 @@ describe("isColorValue", () => {
     ["oklch(0.5 0.2 180)", true],
     ["var(--color-background)", true],
     ["var(--color-blue-500)", true],
+    ["--alpha(var(--color-black) / 10%)", true],
+    ["--alpha(var(--color-black) / 4%)", true],
     ["var(--radius)", false],
     ["var(--spacing)", false],
     ["0.5rem", false],

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"shadcn": patch
 +---
++
 +update color value detection for cssVars
Original file line number	Diff line number	Diff line change
`@@ -898,6 +898,6 @@ export function isColorValue(value: string) {`
`898`	`898`	`value.startsWith("rgb") \|\|`
`899`	`899`	`value.startsWith("#") \|\|`
`900`	`900`	`value.startsWith("oklch") \|\|`
`901`		`- value.startsWith("var(--color-")`
	`901`	`+ value.includes("--color-")`
`902`	`902`	`)`
`903`	`903`	`}`