diff --git a/plugins/postcss-custom-properties/src/lib/get-custom-properties-from-root.ts b/plugins/postcss-custom-properties/src/lib/get-custom-properties-from-root.ts
index e177478fa..79e8285dc 100644
--- a/plugins/postcss-custom-properties/src/lib/get-custom-properties-from-root.ts
+++ b/plugins/postcss-custom-properties/src/lib/get-custom-properties-from-root.ts
@@ -1,5 +1,5 @@
 import valuesParser from 'postcss-value-parser';
-import { isBlockIgnored } from './is-ignored';
+import { isBlockIgnored, hasIgnoreComment } from './is-ignored';
 
 // return custom selectors from the css root, conditionally removing them
 export default function getCustomPropertiesFromRoot(root, opts): Map<string, valuesParser.ParsedValue> {
@@ -8,6 +8,9 @@ export default function getCustomPropertiesFromRoot(root, opts): Map<string, val
 	const customPropertiesFromRootPseudo: Map<string, valuesParser.ParsedValue> = new Map();
 	const out: Map<string, valuesParser.ParsedValue> = new Map();
 
+
+	const isIgnoreCommentInFile = root.source && hasIgnoreComment(root.source.input.css);
+
 	// for each html or :root rule
 	root.nodes.slice().forEach(rule => {
 		const customPropertiesObject = isHtmlRule(rule)
@@ -19,7 +22,7 @@ export default function getCustomPropertiesFromRoot(root, opts): Map<string, val
 		// for each custom property
 		if (customPropertiesObject) {
 			rule.nodes.slice().forEach(decl => {
-				if (decl.variable && !isBlockIgnored(decl)) {
+				if (decl.variable && (!isIgnoreCommentInFile || !isBlockIgnored(decl))) {
 					const { prop } = decl;
 
 					// write the parsed value to the custom property
@@ -33,7 +36,7 @@ export default function getCustomPropertiesFromRoot(root, opts): Map<string, val
 			});
 
 			// conditionally remove the empty html or :root rule
-			if (!opts.preserve && isEmptyParent(rule) && !isBlockIgnored(rule)) {
+			if (!opts.preserve && isEmptyParent(rule) && (!isIgnoreCommentInFile || !isBlockIgnored(rule))) {
 				rule.remove();
 			}
 		}
diff --git a/plugins/postcss-custom-properties/src/lib/is-ignored.ts b/plugins/postcss-custom-properties/src/lib/is-ignored.ts
index e1c5ccc5c..18a926500 100644
--- a/plugins/postcss-custom-properties/src/lib/is-ignored.ts
+++ b/plugins/postcss-custom-properties/src/lib/is-ignored.ts
@@ -1,3 +1,7 @@
+function hasIgnoreComment(input: string) {
+	return /(!\s*)?postcss-custom-properties:\s*(?:off|ignore\s+next)\b/.test(input);
+}
+
 function isBlockIgnored(ruleOrDeclaration) {
 	const rule = ruleOrDeclaration.selector ?
 		ruleOrDeclaration : ruleOrDeclaration.parent;
@@ -15,6 +19,7 @@ function isRuleIgnored(rule) {
 }
 
 export {
+	hasIgnoreComment,
 	isBlockIgnored,
 	isRuleIgnored,
 };