diff --git a/src/css/Stylesheet.ts b/src/css/Stylesheet.ts
index 200e73f58232..e3e4a2dd6536 100644
--- a/src/css/Stylesheet.ts
+++ b/src/css/Stylesheet.ts
@@ -69,7 +69,7 @@ class Rule {
 	transform(code: MagicString, id: string, keyframes: Map<string, string>, cascade: boolean) {
 		if (this.parent && this.parent.node.type === 'Atrule' && this.parent.node.name === 'keyframes') return true;
 
-		const attr = `[${id}]`;
+		const attr = `.${id}`;
 
 		if (cascade) {
 			this.selectors.forEach(selector => {