diff --git a/LayoutTests/inspector/css/css-property-expected.txt b/LayoutTests/inspector/css/css-property-expected.txt
index 538e588cdabf..dc4fc9c0b3cf 100644
--- a/LayoutTests/inspector/css/css-property-expected.txt
+++ b/LayoutTests/inspector/css/css-property-expected.txt
@@ -8,6 +8,8 @@ PASS: "background-repeat" should have at least 1 count.
 PASS: "background-repeat-x" should not be counted.
 PASS: "background-repeat-y" should not be counted.
 PASS: "background-repeat-invalid" should not be counted.
+PASS: "--foo" should not be counted.
+PASS: "--bar" should not be counted.
 
 Sorted by usage:
 [
diff --git a/LayoutTests/inspector/css/css-property.html b/LayoutTests/inspector/css/css-property.html
index 518533a3d898..be33240c949e 100644
--- a/LayoutTests/inspector/css/css-property.html
+++ b/LayoutTests/inspector/css/css-property.html
@@ -17,6 +17,8 @@
             InspectorTest.expectThat(!("background-repeat-x" in WI.CSSProperty._cachedNameCounts), `"background-repeat-x" should not be counted.`);
             InspectorTest.expectThat(!("background-repeat-y" in WI.CSSProperty._cachedNameCounts), `"background-repeat-y" should not be counted.`);
             InspectorTest.expectThat(!("background-repeat-invalid" in WI.CSSProperty._cachedNameCounts), `"background-repeat-invalid" should not be counted.`);
+            InspectorTest.expectThat(!("--foo" in WI.CSSProperty._cachedNameCounts), `"--foo" should not be counted.`);
+            InspectorTest.expectThat(!("--bar" in WI.CSSProperty._cachedNameCounts), `"--bar" should not be counted.`);
 
             InspectorTest.newline();
 
@@ -300,6 +302,8 @@
         background-repeat: repeat;
         background-repeat-x: repeat;
         background-repeat-invalid: repeat;
+        --foo: red;
+        --bar: blue;
         /* background-color: black; */
         /* Not a CSS property */
         /* foo:bar; foo:baz; */
diff --git a/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js b/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js
index 7f60dc0d0b30..c4576d9727d9 100644
--- a/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js
+++ b/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js
@@ -43,13 +43,17 @@ WI.CSSProperty = class CSSProperty extends WI.Object
 
     // Static
 
+    static isVariable(name)
+    {
+        return name.startsWith("--") && name.length > 2;
+    }
+
     static isInheritedPropertyName(name)
     {
         console.assert(typeof name === "string");
         if (WI.CSSKeywordCompletions.InheritedProperties.has(name))
             return true;
-        // Check if the name is a CSS variable.
-        return name.startsWith("--");
+        return WI.CSSProperty.isVariable(name);
     }
 
     // FIXME: <https://webkit.org/b/226647> This naively collects variable-like names used in values. It should be hardened.
@@ -215,7 +219,7 @@ WI.CSSProperty = class CSSProperty extends WI.Object
         this._anonymous = anonymous;
         this._inherited = WI.CSSProperty.isInheritedPropertyName(name);
         this._valid = valid;
-        this._isVariable = name.startsWith("--");
+        this._isVariable = WI.CSSProperty.isVariable(name);
         this._styleSheetTextRange = styleSheetTextRange || null;
 
         this._rawValueNewlineIndent = "";
@@ -576,7 +580,10 @@ WI.CSSProperty = class CSSProperty extends WI.Object
             return;
 
         let changeCount = (propertyName, delta) => {
-            if (!propertyName || this._implicit || this._anonymous || !this._enabled)
+            if (this._implicit || this._anonymous || !this._enabled)
+                return;
+
+            if (!propertyName || WI.CSSProperty.isVariable(propertyName))
                 return;
 
             let cachedCount = WI.CSSProperty._cachedNameCounts[propertyName];
diff --git a/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js b/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js
index f3886fcdb08a..c151f2a817b8 100644
--- a/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js
+++ b/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js
@@ -358,7 +358,7 @@ WI.CSSStyleDeclaration = class CSSStyleDeclaration extends WI.Object
                     let variableTokens = tokens.slice(startIndex, i + 1);
                     startIndex = NaN;
 
-                    let variableNameIndex = variableTokens.findIndex((token) => token.value.startsWith("--") && /\bvariable-2\b/.test(token.type));
+                    let variableNameIndex = variableTokens.findIndex((token) => WI.CSSProperty.isVariable(token.value) && /\bvariable-2\b/.test(token.type));
                     if (variableNameIndex === -1)
                         continue;
 
diff --git a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
index 55c9b0face60..5e1c0074563a 100644
--- a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
+++ b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
@@ -884,7 +884,7 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
                     continue;
 
                 let rawTokens = tokens.slice(startIndex, i + 1);
-                let variableNameIndex = rawTokens.findIndex((token) => token.value.startsWith("--") && /\bvariable-2\b/.test(token.type));
+                let variableNameIndex = rawTokens.findIndex((token) => WI.CSSProperty.isVariable(token.value) && /\bvariable-2\b/.test(token.type));
                 if (variableNameIndex !== -1) {
                     let contents = rawTokens.slice(0, variableNameIndex + 1);