diff --git a/packages/core/ui/styling/css-selector/index.ts b/packages/core/ui/styling/css-selector/index.ts
index 32a69df57..b661399fa 100644
--- a/packages/core/ui/styling/css-selector/index.ts
+++ b/packages/core/ui/styling/css-selector/index.ts
@@ -1,4 +1,5 @@
 import '../../../globals';
+import { isCssVariable } from '../../core/properties';
 import { isNullOrUndefined } from '../../../utils/types';
 
 import * as cssParser from '../../../css';
@@ -523,7 +524,7 @@ export function fromAstNodes(astRules: cssParser.Node[]): RuleSet[] {
 }
 
 function createDeclaration(decl: cssParser.Declaration): any {
-	return { property: decl.property.toLowerCase(), value: decl.value };
+	return { property: isCssVariable(decl.property) ? decl.property : decl.property.toLowerCase(), value: decl.value };
 }
 
 function createSimpleSelectorFromAst(ast: parser.SimpleSelector): SimpleSelector {