diff --git a/src/compiler/compile/css/Selector.ts b/src/compiler/compile/css/Selector.ts
index d9868f453060..5123f6fec43a 100644
--- a/src/compiler/compile/css/Selector.ts
+++ b/src/compiler/compile/css/Selector.ts
@@ -21,7 +21,8 @@ enum NodeExist {
 }
 
 const whitelist_attribute_selector = new Map([
-	['details', new Set(['open'])]
+	['details', new Set(['open'])],
+	['dialog', new Set(['open'])]
 ]);
 
 export default class Selector {
diff --git a/test/css/samples/attribute-selector-dialog-open/expected.css b/test/css/samples/attribute-selector-dialog-open/expected.css
new file mode 100644
index 000000000000..54d85c4ee8f2
--- /dev/null
+++ b/test/css/samples/attribute-selector-dialog-open/expected.css
@@ -0,0 +1 @@
+dialog[open].svelte-xyz{display:grid}
\ No newline at end of file
diff --git a/test/css/samples/attribute-selector-dialog-open/input.svelte b/test/css/samples/attribute-selector-dialog-open/input.svelte
new file mode 100644
index 000000000000..d90211f1b219
--- /dev/null
+++ b/test/css/samples/attribute-selector-dialog-open/input.svelte
@@ -0,0 +1,7 @@
+<dialog>Hello</dialog>
+
+<style>
+	dialog[open] {
+		display: grid;
+	}
+</style>