From 475893a105ac04967f702ce43561adde8d18f55b Mon Sep 17 00:00:00 2001
From: Changsu Seong <110822847+scs0209@users.noreply.github.com>
Date: Mon, 14 Sep 2026 16:03:09 +0900
Subject: [PATCH] Fix whitespace-only custom property with `!important`
 (#20055)

Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: fisker <lionkay@gmail.com>
---
 changelog_unreleased/css/20055.md             | 19 ++++++++++++++
 src/language-css/print/css-declaration.js     |  3 ++-
 .../__snapshots__/format.test.js.snap         | 26 ++++++++++++++++++-
 tests/format/css/important/format.test.js     |  2 +-
 tests/format/css/important/important.css      | 12 +++++++++
 5 files changed, 59 insertions(+), 3 deletions(-)
 create mode 100644 changelog_unreleased/css/20055.md

diff --git a/changelog_unreleased/css/20055.md b/changelog_unreleased/css/20055.md
new file mode 100644
index 000000000..d4b2c5785
--- /dev/null
+++ b/changelog_unreleased/css/20055.md
@@ -0,0 +1,19 @@
+#### Fix whitespace-only custom property with `!important` (#20055 by @scs0209)
+
+<!-- prettier-ignore -->
+```css
+/* Input */
+a {
+  --x: !important;
+}
+
+/* Prettier stable */
+a {
+  --x:  !important;
+}
+
+/* Prettier main */
+a {
+  --x: !important;
+}
+```
diff --git a/src/language-css/print/css-declaration.js b/src/language-css/print/css-declaration.js
index 28cc343bd..611f3b36c 100644
--- a/src/language-css/print/css-declaration.js
+++ b/src/language-css/print/css-declaration.js
@@ -82,7 +82,8 @@ function printCssDeclaration(path, options, print) {
   parts.push(value);
 
   if (node.raws.important) {
-    parts.push(node.raws.important.replace(/\s*!\s*important/i, " !important"));
+    const directive = `${isValueAllSpace ? "" : " "}!important`;
+    parts.push(node.raws.important.replace(/\s*!\s*important/i, directive));
   } else if (node.important) {
     parts.push(" !important");
   }
diff --git a/tests/format/css/important/__snapshots__/format.test.js.snap b/tests/format/css/important/__snapshots__/format.test.js.snap
index 6ae8ea310..8a32a46c4 100644
--- a/tests/format/css/important/__snapshots__/format.test.js.snap
+++ b/tests/format/css/important/__snapshots__/format.test.js.snap
@@ -2,17 +2,41 @@
 
 exports[`important.css format 1`] = `
 ====================================options=====================================
-parsers: ["css"]
+parsers: ["css", "less", "scss"]
                                                       printWidth: 80 (default) |
 =====================================input======================================
 div {
   max-height: none !important;
 }
 
+a {
+  --x11:!important;
+  --x12: !important;
+  --x13:          !important;
+  --x21:;
+  --x22: ;
+  --x23:          ;
+  --x31:x!important;
+  --x32:x !important;
+  --x33:x          !important;
+}
+
 =====================================output=====================================
 div {
   max-height: none !important;
 }
 
+a {
+  --x11:!important;
+  --x12: !important;
+  --x13:          !important;
+  --x21:;
+  --x22: ;
+  --x23:          ;
+  --x31: x !important;
+  --x32: x !important;
+  --x33: x !important;
+}
+
 ================================================================================
 `;
diff --git a/tests/format/css/important/format.test.js b/tests/format/css/important/format.test.js
index 96617399e..a3ab9e875 100644
--- a/tests/format/css/important/format.test.js
+++ b/tests/format/css/important/format.test.js
@@ -1 +1 @@
-runFormatTest(import.meta, ["css"]);
+runFormatTest(import.meta, ["css", "less", "scss"]);
diff --git a/tests/format/css/important/important.css b/tests/format/css/important/important.css
index 27815b2dc..b9a571980 100644
--- a/tests/format/css/important/important.css
+++ b/tests/format/css/important/important.css
@@ -1,3 +1,15 @@
 div {
   max-height: none !important;
 }
+
+a {
+  --x11:!important;
+  --x12: !important;
+  --x13:          !important;
+  --x21:;
+  --x22: ;
+  --x23:          ;
+  --x31:x!important;
+  --x32:x !important;
+  --x33:x          !important;
+}